# 全局安装 vue-cli$ npm install --global vue-cli# 创建一个基于 webpack 模板的新项目$ vue init webpack palanWebsite# 安装依赖，走你$ cd palanWebsite$ npm install$ npm run dev

创建过程参考：https://www.2cto.com/kf/201711/695061.html，单元测试选择的是jest

创建好的项目结构如下：

下面就重点分析build和config目录下各个配置文件的解析：

config目录下的各项配置都是为了服务webpack的配置，给不同的编译条件提供配置

config/index.js

'use strict'const path = require('path')module.exports = {  dev: {    // Paths    assetsSubDirectory: 'static',    assetsPublicPath: '/',    proxyTable: {},    // Various Dev Server settings    host: 'localhost', // can be overwritten by process.env.HOST    port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined    autoOpenBrowser: false,    errorOverlay: true,    notifyOnErrors: true,    poll: false,     useEslint: true,    showEslintErrorsInOverlay: false,    /**     * Source Maps     */    // https://webpack.js.org/configuration/devtool/#development    devtool: 'cheap-module-eval-source-map',    cacheBusting: true,    cssSourceMap: true  },  build: {    // 在任何模块文件内部，可以使用__dirname变量获取当前模块文件所在目录的完整绝对路径。    index: path.resolve(__dirname, '../dist/index.html'),    // Paths    assetsRoot: path.resolve(__dirname, '../dist'),    assetsSubDirectory: 'static',    assetsPublicPath: '/',    /**     * Source Maps     */    productionSourceMap: true,    // https://webpack.js.org/configuration/devtool/#production    devtool: '#source-map',    productionGzip: false,    productionGzipExtensions: ['js', 'css'],    // Run the build command with an extra argument to    // View the bundle analyzer report after build finishes:    // `npm run build --report`    // Set to `true` or `false` to always turn it on or off    bundleAnalyzerReport: process.env.npm_config_report  }}

详解：http://www.cnblogs.com/whkl-m/p/6627864.html