vue脚手架的安装

安装vue的脚手架 首先本地得有 node.js的环境  如果不知道自己电脑上由还是没有的话  可以打开终端 输入 node -v进行测试 如果出来了 node.js的版本号 则表示说你的电脑上安装了node.js的环境 

node.js的下载地址：https://nodejs.org/en/download/

下面我们要安装一个vue脚手架的生成器 还是在桌面新建一个目录用来存储你的项目文件,进入文件打开命令行终端

输入  npm install vue-cli -g  这个是全局安装   全局是你安装之后在其他的地方再安装脚手架就不用使用这个命令了  install  可以简写成   i

如果你觉得安装的太慢 那是因为 这个安装的服务器是再国外的服务器上 这时你可以转接到国内的淘宝镜像 

npm set registry https://registry.npm.taobao.org/

下面我们要生成一个基于 webpack打包工具的vue脚手架  打包的知识 我就不再这里一一赘述了  有兴趣的童鞋去官方文档看着学习学习

vue init webpack 项目名字

除了 第一个 install vue-router  写yes 外  其他的看你自己 选择  尽量还是选 no      

vue-router不知道是啥的童鞋 自己百度

剩下的就一直按回车就行了

安装成功之后   cd  项目名称  启动脚手架 ：npm run dev   默认监视的是8080端口 

如果浏览器端口输入 localhost:8080

如果你看见 下面的图片表示你安装成功了   

最后 还得配置下 打包  因为你的项目最后写完之后要打包上线的

修改下面的文件   红字标识的是你要修改的内容地方

mydemo/config/index.js

build: {

    // Template for index.html

    index: path.resolve(__dirname, '../dist/index.html'),

 

    // Paths

    assetsRoot: path.resolve(__dirname, '../dist'),

    assetsSubDirectory: 'static',

assetsPublicPath: './',   

C:\xampp1\htdocs\tao\zhi\vuecil\mydemo\build\utils.js

if (options.extract) {

      return ExtractTextPlugin.extract({

        use: loaders,

        fallback: 'vue-style-loader',

                  publicPath:"../../"

      })

    } else {

      return ['vue-style-loader'].concat(loaders)

    }

  }

配置完成后 ，你的项目也完成之后  运行 npm  run build  整个vue脚手架就会打包到一个dist文件夹 里面就一个 index.html和一个public文件   放到你的服务器上就可以了