webpack
i'm cool
这个作者很懒,什么都没留下…
展开
-
webpack踩坑五:js处理
一:js代码检查使用eslint来检查js代码,需要安装eslint和eslint-loader,eslint的规则配置使用airbnb规则,而使用它需要安装eslint-config-airbnb-base、eslint-plugin-import然后在package.json中配置eslintConfig选项最后在webpack.config.js中配置eslint检查首先要排除掉node_modules文件夹下的所有文件,防止eslint检查,在选项里面配置fix:true,表示检查到的原创 2021-05-08 12:44:15 · 265 阅读 · 2 评论 -
webpack踩坑四:css处理
一:提取css成单独文件使用插件mini-css-extract-plugin,安装插件,在webpack plugins配置中使用,这里的filename配置项就是输出的css的名称并且在使用css-loader之后,使用MiniCssExtractPlugin.loader,而不是使用style-loader。(loader解析都是自下而上,从左往右)简单介绍下几个loader的意思:css-loader: 将css放到js中;style-loader: 创建style标签,将css原创 2021-05-08 10:16:38 · 1205 阅读 · 0 评论 -
webpack踩坑三:打包其他资源
错误经历:打包其他资源的时候,漏掉了一些其他的文件,导致打包失败还有其他的图片资源,在exclude中没有排除掉,导致图片不能正常加载解决方案:exclude中排除掉所有需要参与打包的文件类型**ps:切记排除掉所有的参与打包的文件类型!**...原创 2021-05-07 11:28:06 · 140 阅读 · 0 评论 -
webpack踩坑二:解析html中的图片
错误经历:安装了html-loader,html-webpack-plugin,使用了html模板,导致html图片不能解析这里的img不能在页面中正确的解析出现解决方案:1.去掉配置中的html-loader2.html模板中图片路径采用ejs引入页面成功显示图片...原创 2021-05-07 10:43:35 · 370 阅读 · 0 评论 -
webpack踩坑一:webpack-dev-server启动报错
问题:启动webpack-dev-server的时候报错此前已经全局安装过了,继续安装,再启动webpack-dev-server报错解决方法:webpack和webpack-cli 版本不一致,降低webpack-cli版本,重新指定版本安装webpack-cli启动webpack-dev-serve,成功打开。附上我的包版本...原创 2021-05-07 10:01:13 · 1349 阅读 · 0 评论