thinkphp5+Swoole+vue实现im聊天系统—环境安装(node+vue环境)vue全家桶

对于安装vue全家桶没有什么经验,通常用js框架就是自己引用,不过这涉及到一些依赖还是要安装标准流程来!
因为需要安装node环境支持,所以先去nodejs官网去下载,这可以自己百度,点击安装就可以了,安装的时候要配置path环境变量,所以我直接选择add to path选项了!
安装好后,桌面生成了一个Boxstarter Shell图标,我是在这个里面安装的

cd E:\im
vue init webpack app

QQ图片20181119171846.png

这里有一堆选择,反正我是一路YYYY,
然后输入:

npm install

QQ图片20181119171954.png

这就成了,打开文件可以发现生成了app文件

npm run dev

QQ图片20181119172644.png
这样就可以运行了,感觉和pthon的环境很类似,php的话有很多成熟的集成环境
现在可以看到生成的目录:
QQ图片20181119173137.png

上面是默认安装的目录结构。
默认安装完毕后的目录结构不咋地 我们需要修改一下

src/assets/css 放置样式文件
src/assets/fonts/ 放置字体图标文件
src/assets/images/ 放置图片文件
src/components 放置公共组件
src/view/ 放置页面组件
src/config/ 放置项目配置文件
src/utils/ 放置工具函数文件
src/store/ 放置vuex文件
src/route/ 放置路由文件
src/api/ 放置接口文件

在src/config 创建index.js:

/**
 * 配置文件
 */

export default {
    /**
     * token在Cookie中存储的天数
     */
    cookieExpires: 1,

    /**
     * api请求基础路径
     */
    baseUrl: {
        dev: '',
        pro: ''
    },

    /**
     * ajax请求超时配置
     */
    httpTimeOut: 10000,

    /**
     * token key
     */

    tokenKey: 'token'
}

标签: vue

发表评论:

whatsapp营销