vue的使用(安装vue-cli脚手架)

 

 vue官方中文文档：
https://cn.vuejs.org/v2/guide/

 
1、安装vue-cli 脚手架工具 
cnpm install  -g vue-cli@2.9.6
vue -V #查看安装的版本

2、初始化vue工程
初始化一个基于webpack的vue的demo工程
vue init webpack  demo
如果安装npm依赖较慢，可以ctrl+c终止掉，使用cnpm install 进行安装。
cd demo 
cnpm install 


3、修改config/index.js 将项目修改为可本地浏览运行的程序(可正确加载静态资源)

build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',   // 将这里的'/'修改为'./'即可

    //...
}

4、vue常用命令 
npm run dev   #运行开发，浏览器访问http://localhost:8080
npm run build #打包到dist目录，可将dist目录中所有文件部署的nginx等静态资源服务器

5、运行npm run build后

找到项目的dist目录，双击index.html可本地运行。