vue、gulp、webpack踩过的坑和笔记

1.监听流错误 stream-combiner2

2.热更新Browsersync与element冲突，换成gulp-connect

3.gulp-uglify压缩js不能压缩es6

4.使用vue-cli 运行npm run build --report 能够输出构建状况 浏览器自动访问 http://127.0.0.1:8888

5.在使用vue-cli建立项目时，git中use arrow keys选项在windows中 keys为序号，好比输入1而后按enter会选择第一个，依次类推

6.vue-cli中import()报错eslint: parsing error: unexpected token import或者Parsing Error inside template tag须要加配置 https://github.com/vuejs/eslint-plugin-vue/issues/186

parserOptions: {
  parser: 'babel-eslint'
}

7.webpack4 中mode能够经过cli命令--mode设置，也能够在配置文件中添加mode选项

18.webpack钟bundle分析地址https://www.webpackjs.com/guides/code-splitting/

9.CommonsChunkPlugin分离公共块时，async和filename冲突，children和chunks冲突，规定了async而name不是入口chunk时，name的名字不起做用

10.HtmlWebpackPlugin生成html时，就是有时不按顺序插入用 chunksSortMode: 'manual'

11.vue模板中用scss语法设置为 lang="scss" type="text/scss"，否则会报语法错误

12.vuex的状态值不能为组件实例，不然会报错

13.vue项目的扩大，热更新老是报错FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - process out of memory，致使须要频繁重启，解决方法

把package.json中
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
改成
"dev": "node --max-old-space-size=4096 ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --progress --config build/webpack.dev.conf.js",
用以解除v8的内存限制

14.vue中报parsing error: unexpected token <错误，是由于.eslintrc和package.json中的eslintConfig并非融合关系，保留一个 

15.vue-cli升级webpack4，生产环境cacheGroups中缓存模块名字不起做用，是由于

chunkFilename: utils.assetsPath('js/[id].[chunkhash].js') //webpack3中用CommonsChunkPlugin分离时

chunkFilename: utils.assetsPath('js/[name].[chunkhash].js') //webpack4中用splitChunks分离时

 

 

vue/cli3.x

1.devserver代理中能够用cookieDomainRewrite、cookiePathRewrite来重写服务端中发来的cookie

2.安装@vue/cli-plugin-pwa后在service-worker本身配置的https中报 An SSL certificate error occurred when fetching the script.错误。若是是本地测试的话只用部署个普通的http服务就好了。