webpack
文章平均质量分 64
ccxCode
这个作者很懒,什么都没留下…
展开
-
webpack之多页面应用打包
多页面应用(MPA)概念 每⼀次⻚⾯跳转的时候,后台服务器都会给返回⼀个新的 html ⽂档,这种类型的⽹站就是多⻚⽹站,也叫做多⻚应⽤。 多页面打包思路 每个页面对应一个entry,一个html-webpack-plugin 需要解决避免每次新增或删除页面都要修改webpack配置 使用glob模块,用它可以查找符合特定规则的文件路径名 webpack中写入这段核心代码能够实现自动化添加或删除页面的功能,但是需要文件目录需要保持一定规律。如: { index: ‘d:/code/webpack/my-原创 2021-07-18 00:47:11 · 564 阅读 · 0 评论 -
静态资源内联
HTML 和 JS内联 代码层面 页面框架的初始化脚本 css内联避免页面闪动 请求层面:减少HTTP网络请求数 ⼩图⽚或者字体内联 (url-loader) html-webpack-plugin使用的是ejs模板引擎 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=原创 2021-07-17 23:53:59 · 122 阅读 · 1 评论 -
webpack之css样式增强
css 前缀补齐 安装插件postcss-loader、autoprefixer webpack中添加配置 { test: /\.less$/, use: [ MiniCssExtractPlugin.loader, 'css-loader', 'less-loader', { loader: 'postcss-loader', options: { plugins: () => [ requi原创 2021-07-17 16:33:30 · 111 阅读 · 0 评论 -
webpack的基本使用
概念 webpack概念请移步阅读官网 loader解析不同文件类型 解析txt module: { rules: [ { test: /\.txt$/, use: 'raw-loader' } } 解析es6和react jsx module: { rules: [ { test: /\.js$/, use: 'babel-loader' }, } babel的配置⽂件是:.babelrc,需要安装的依赖如下原创 2021-07-17 00:59:32 · 104 阅读 · 0 评论