2022年6月13日

webpack基础——loader的简单使用

摘要: 当需要打包图片的时候 npm i file-loader 或者 url-loader 区别: url-loader 更高级,可以更具图片的大小,选择打包的方式(转化成base64存在js里 / 转换成 url 通过网络请求获取) 当图片较小如1-2kb时放在js里可以减少请求次数,但图片过大时,转换 阅读全文

posted @ 2022-06-13 23:44 In-6026 阅读(35) 评论(0) 推荐(0) 编辑

webpack基础——插件,自动生成html引入打包后的js文件,html模板

摘要: npm i html-webpack-plugin const path = require('path') const HtmlWebpackPlugin = require('html-webpack-plugin') //引入 module.exports = { entry: { main: 阅读全文

posted @ 2022-06-13 23:17 In-6026 阅读(315) 评论(0) 推荐(0) 编辑

webpack基础——多入口打包与占位符[ ]

摘要: const path = require('path') module.exports = { entry: { //此处从两个入口进入,打包产生两个文件 main: path.join(__dirname, './src/js/main.js'), sub: path.join(__dirname 阅读全文

posted @ 2022-06-13 23:03 In-6026 阅读(68) 评论(0) 推荐(0) 编辑

webpack基础——安装环境

摘要: npm i webpack webpack-cli --save-dev ###单个打包文件 默认配置 npx webpack index.js //这就会把 index.js 及其依赖打包到 dist 文件夹下,生成一个同名文件 自定义配置,需要 wepack.config.js,在根目录下创建该 阅读全文

posted @ 2022-06-13 22:54 In-6026 阅读(17) 评论(0) 推荐(0) 编辑

导航