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服务就行了。
3.用yarn装@vue/cli,会报vue: command not found,需要换成npm装
4.项目中添加standard规则
vue invoke eslint --config standard
主要做了以下事情
1. 在eslint配置中添加了extends: ['@vue/standard']
2. 安装了依赖:
@vue/eslint-config-standard
eslint-plugin-import
eslint-plugin-node
eslint-plugin-promise
eslint-plugin-standard
5. 函数式组件必须返回createElement函数生成的vnode,不然无法显示
vue、gulp、webpack踩过的坑和笔记的更多相关文章
- vue+ vue-router + webpack 踩坑之旅
说是踩坑之旅 其实是最近在思考一些问题 然后想实现方案的时候,就慢慢的查到这些方案 老司机可以忽略下面的内容了 1)起因 考虑到数据分离的问题 因为server是express搭的 自然少 ...
- vue+axios自己踩过的坑
axios的介绍就不用了吧,api有具体的介绍axios或者是axios中文: 主要讲的就是我自己在第一次使用axios中遇到的问题,及二次封装 先来说说二次封装,之前自己也是网上找了很多同学的封装, ...
- webpack踩过的坑(总结)
使用process.argv 获取命令行使用的参数 // 判断是否带production参数,production会压缩js var isprod = false; for (var i in pro ...
- vue+node+mongoose踩过的坑
1.当你在cmd中输入npm run dev的时候,出现这种错误 很有可能是目前的端口被占用了,可以把所有可能用到这个端口号的应用关闭或者你直接改一个新的端口号 修改端口的方法:新打开一个cmd,然后 ...
- 使用vue开发项目需要注意的问题和可能踩到的坑
最近,在公司给一些刚刚使用vue进行开发的同学做了一次分享, 其中包括一些vue开发中需要注意的点, 以及一些可能会踩到的坑.具体内容如下: 一.生命钩子使用需要注意的地方 1.beforeCreat ...
- 做一个gulp+webpack+vue的单页应用开发架子
1.目标 最近项目上的事情不多,根据我自己的开发习惯,决定开发一些简单的开发架子,方便以后事情多的时候直接套用.本文讲的一个gulp+webpack+vue的单页应用架子,想要达到的目的: 可以通过命 ...
- gulp+webpack+vue
gulp+webpack+vue 章节目录 1.目标 2.实现 2.1合并库文件 2.2组织业务代码 2.3打包开发代码 2.4使用webpack-dev-server和热替换插件HotModuleR ...
- 开始更新webpack踩坑笔记
今天开始学习webpack,记录下踩过的坑-zxf
- [坑况]——webpack搭建前端环境踩过的坑啊
前言 嘿哈,webpack搭建前端环境踩过的坑啊! 第一个:完全不知所措 webpack4 下面用不了HtmlWebpackPlugin 和 ExtractTextPlugin 解决方案: html- ...
随机推荐
- 【TCP/IP】TCP详解笔记
目录 前言 17. TCP 传输控制协议 17.1 引言 17.2 TCP 服务 17.3 TCP的首部 18. TCP连接的建立与终止 18.1 引言 18.2 连接的建立与终止 18.2.1 建立 ...
- NOIP模拟测试9「随·单·题」
liu_runda出的题,先$\%\%\%\%\%\%\%\%\%\%\%$为敬 随 考试时没有Qj 然后甚至没做,甚至没交 我不知道我怎么想的 这个题挺难改 你需要用到 循环矩阵快速幂,矩阵快速幂优 ...
- CMD批处理(4)——批处理循环语句结构
FOR函数,对一组文件批量执行命令,基本模式如下 1.文件搜索 for [/D] [/R [路径]] %%变量 in (集合) do (命令) 2.等差数列 for /L %%变量 in (开始,间隔 ...
- Pytest学习笔记5-conftest.py的用法
前言 在之前介绍fixture的文章中,我们使用到了conftest.py文件,那么conftest.py文件到底该如何使用呢,下面我们就来详细了解一下conftest.py文件的特点和使用方法吧 什 ...
- 机械革命z2安装ubuntu20
为了性能买了个游戏本机械革命z2,但还是想用上linux,身为程序员习惯了linux的开发环境有点离不开.但是之前尝试安装deepin或者linux都失败了,一是N卡条件下安装过程和安装之后的显示有问 ...
- c#将图片Image转换为内存流MemoryStream
HttpWebResponse resp = (HttpWebResponse)wRequest.GetResponse(); Stream stream = resp.GetResponseStre ...
- 44、djanjo工程(介绍)
44.1.什么时web框架: 1.框架,即framework,特指为解决一个开放性问题而设计的具有一定约束性的支撑结构,使用看框架可以 帮助你快速开发特定的形同,简单的说,就是你用别人搭建好的舞台来做 ...
- 数据备份[APIO/CTSC 2007]题解
题目描述 你在一家IT公司为大型写字楼或办公楼的计算机数据做备份. 然而数据备份的工作是枯燥乏味的,因此你想设计一个系统让不同的办公楼彼此之间互相备份,而你则坐在家中尽享计算机游戏的乐趣. 已知办公楼 ...
- NoSql非关系型数据库之MongoDB应用(一):安装MongoDB服务
业精于勤,荒于嬉:行成于思,毁于随. 一.MongoDB服务下载安装(windows环境安装) 1.进入官网:https://www.mongodb.com/,点击右上角的 Try Free , 2 ...
- Netty 框架学习 —— UDP 广播
UDP 广播 面向连接的传输(如 TCP)管理两个网络端点之间的连接的建立,在连接的生命周期的有序和可靠的消息传输,以及最后,连接的有序终止.相比之下,类似 UDP 的无连接协议中则没有持久化连接的概 ...