渐进式 JavaScript 框架Vue项目配置（三）

项目创建成功之后用IDEA打开：在package.json同级目录下创建vue.config.js

// vue.config.js 没使用的配置采用官方默认配置参考：https://cli.vuejs.org/zh/config/
module.exports = {
    /**
     *指定根目录,第一个参数代表开发环境,第二个代表上线环境，
     *上线环境有子目录例如https://www.baidu.com/webapp/,
     *上线环境目录为:/webapp/ build项目时css,js会指向上线环境
     *例：href="/webapp/css/hello.css"
     */
    publicPath: process.env.NODE_ENV === 'production' ? '/' : '/',
    //用于放置生成的静态资源 (js、css、img、fonts)
    assetsDir: "assets",
    //生成的文件是否追加hash值,例:hello.f151b4d3.js
    filenameHashing: false,
    //配置地址
    devServer: {
        host:"0.0.0.0",
        port: 80,
        https: false,
        //启动打开浏览器
        open: false,
        //禁用主机检查
        disableHostCheck:false,
        //跨域请求
        /*跨域请求如果你的前端应用和后端 API 服务器没有运行在同一个主机上，
        你需要在开发环境下将 API 请求代理到 API 服务器。*/
        //proxy: 'http://555.555.555.555:80'
    },
    // 第三方插件配置
    pluginOptions: {}
};

package.json 可以启动和编译项目

{
  "name": "demo",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve", //启动服务 
    "build": "vue-cli-service build", //编译
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "register-service-worker": "^1.5.2",
    "vue": "^2.5.21",
    "vue-router": "^3.0.1",
    "vuex": "^3.0.1"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.3.0",
    "@vue/cli-plugin-eslint": "^3.3.0",
    "@vue/cli-plugin-pwa": "^3.3.0",
    "@vue/cli-service": "^3.3.0",
    "@vue/eslint-config-prettier": "^4.0.1",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.2",
    "vue-template-compiler": "^2.5.21"
  }
}

或者通过cmd在项目根目录打开执行

npm run serve 启动项目

npm run bulid 编译项目