cli 搭建Vue 环境

0、安装淘宝镜像

$ npm install -g cnpm –registry=https://registry.npm.taobao.org

1、 npm初始化

$ npm init

2、 webpack配置
主要需要配置babel，把es6预处理为es5，配置文件如下：

const path = require('path');

module.exports = {
    entry: './app/main.js',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: 'public'
    },
    module: {
        rules: [{
            test: /\.js$/,
            exclude: [
                path.resolve(__dirname,"node_modules")
            ],
            loader: "babel-loader",
            options: {
                presets: ["es2015"]
            }
        }]
    }
}

3、 安装webpack

$ cnpm install –save-dev webpack

4、 安装webpack-dev-server

$ cnpm install –save-dev webpack-dev-server

5、 修改package.json文件配置，开启端口监听

"scripts": {
    "server": "webpack-dev-server --content-base ./ --port 8080"
  },

6、安装babel依赖

$ cnpm install –save-dev babel-core

$ cnpm install –save-dev babel-loader

$ cnpm install –save-dev babel-preset-es2015

7、 安装指定版本vue

$ cnpm install –save vue@1

至此，所有环境配置完成

文档结构图如下：

    └ root
    │   └ app
    │   │   └ main.js
    │   └ node_modules
    │   │   └  *.js
    │   └ index.html
    │   └ package.json
    │   └ webpack.config.js

---

8、 运行项目

$ npm run server

恭喜你，通过 CLI 配置最基本的 vue 环境你已经完成了！