随笔分类 - 前端工程化
摘要:webpack5中通过使用 webpack-dev-server 插件,配置 devServer 来浏览器启动页面,对于单页面,我们可以直接配置打开首页,多页面,可以配置打开一个文件目录,选择各个页面的目录 当我们配置好 webpack 后,执行 npm run dev,浏览器打开经常会看到显示 c
阅读全文
摘要:webpack5 内置了缓存配置 在 webpack 配置对象下,增加: cache: { type: 'filesystem', allowCollectingMemory: true } webpack5 可以通过引入 thread-loader 来开启多线程 { test: /\.js$/,
阅读全文
摘要:实际开发体验中,大家都可以明显感觉到 rollup 都比 webpack 启动快多了,实际是什么原因? 个人理解: 1. vite 在开发阶段,采用了 esbuild 依赖预构建,所以大家会感觉到首次 run dev 的时候会稍微慢一些,如果 package.json 中依赖的包改变了,还会重新构建
阅读全文
摘要:背景 工作中,默认提测分支叫 staging,每次提测,都需要将开发分支合并到 staging 提测分支,并 push,才算提测,当修复一些 bug 之后,免不了反复执行同一套 git 命令,于是写一个简单的 shell 脚本,减少重复工作。 注意 本脚本仅适用于开发分支合并到提测分支(目标分支),
阅读全文
摘要:acorn内部的实现 https://zhuanlan.zhihu.com/p/149323563 编译原理之词法与语法 https://zhuanlan.zhihu.com/p/149793021 typescript编译原理 https://zhuanlan.zhihu.com/p/499859
阅读全文
摘要:eslint 和prettier ,如果有语法错误,都会阻止代码自动格式化 相当于,需要你先解决掉语法错误之后,再自动给你格式化 配置错误 eslint Parsing error: ecmaVersion must be 3, 5, 6, or 7: 解决方案:https://stackoverf
阅读全文
摘要:前言 当前,前端项目支持代码规范校验、代码格式化已经必不可少,同时需要支持代码提交前对代码格式校验预检查,这里提供一份最简单的配置供大家参考。 每个包代表了什么 在配置之前,先了解用实现代码规范化、git 提交信息校验用到的包。 1.代码格式规范相关 eslint:代码格式校验 prettier:p
阅读全文
摘要:webpack.dev.js const merge = require('webpack-merge'); const webpack = require("webpack"); const path = require('path'); const common = require('./web
阅读全文
摘要:背景: webpack使用image-webpack-loader 打包报错 Error: Cannot find module 'gifsicle',问题原因为image-webpack-loader loader版本过低。 解决办法: 删除nodu_modules下的image-webpack-
阅读全文
摘要:webpack.common.js webpacl.prod.js
阅读全文
摘要:用webpack打包页面,发现html中特别写的用来给后端识别的大写标签全部被转为了小写标签,这时候需要将加一个配置 ,caseSensitive:true ,禁止大小写转换。 webpack配置: 参考文档链接: https://github.com/kangax/html-minifier#op
阅读全文
摘要:在家里安装这个包,总是报错安装失败,换成最快的淘宝镜像也是如此,先卸载重新安装亦是如此,于是想到了原因,到了公司,公司的网是可以连接国外的,安装成功了! 也就是说,需要FQ才可以装成功。
阅读全文
摘要:这时候记得在webpack配置文件中
阅读全文
摘要:转载自:http://blog.csdn.net/hsl0530hsl/article/details/78363222
阅读全文
摘要:webpack使用总结: 入门使用: 这个报错说明需要安装相应的Loader,并在引用时指定相应的loader 执行成功如图: chunk指相应的区块。 要是css引入正确:必须引入css-loader,要使改变的css生效,要引入style-loader; 各个js的函数调用只能在各自的函数中写,
阅读全文