webpack
Akimoto Hiroshi
这个作者很懒,什么都没留下…
展开
-
webpack4自动打包爬坑
为什么引用/bundle.js?根目录下面没有bundle.js啊?我们先看打包结果:这里指出了,webpack输出的文件被托管在localhost:8080的根目录/下面原创 2021-02-17 15:15:06 · 118 阅读 · 1 评论 -
webpack 打包图片资源url-loader和file-loader
以下教程基于webpack 4.46.0:当前src目录下有这些文件:test2.htmltest2.less,里面引用了3张图片:test2.js,引入test2.less:webpack.config.js如下:const path = require('path')const HtmlWebpackPlugin = require('html-webpack-plugin')module.exports = { entry: './src/test2.js', out原创 2021-01-16 19:43:55 · 336 阅读 · 0 评论 -
webpack 打包html资源
现在有这两个文件需要打包:我们需要的插件名字叫html-webpack-plugin,先下载引入:使用,在plugins里面配置:执行:发现默认会多了两个文件:生成的index.html默认会引用built.js所以这次打包默认的功能就是我们指定一下HtmlWebpackPlugin的的配置对象template:就表示复制一个test1,html文件并且引入打包输出的所有资源...原创 2021-01-16 18:21:51 · 314 阅读 · 0 评论 -
webpack4 配置less-loader
这篇教程webpack版本:4.46.0我们的webpack.config.js的配置如下:const path = require('path')//module.exports是commonjs语法module.exports = { entry: './src/index.js', output: { filename: 'built.js', path: path.join(__dirname, 'build') }, module: { rule原创 2021-01-16 16:33:08 · 4488 阅读 · 0 评论 -
webpack4配置css-loader和style-loader
ebpack --entry ./src/index.js -o ./build --mode=development经过这样的配置:const path = require('path')//module.exports是commonjs语法module.exports = { entry: './src/index.js', output: { filename: 'built.js', path: path.join(__dirname, 'bu...原创 2021-01-16 16:15:54 · 1042 阅读 · 0 评论 -
webpack配置
配置webpack build命令配置好了这个命令以后打包项目就可以使用:npm run build这个命令去让webpack打包,并且输出到dist(下图配置了output就是打包结果输出到当前目录下的dist文件夹里,输出结果的名字叫bundle.js)上面的代码有问题,还是要用\转义一下.这个符号配置webpack处理图片,这里为了简单,只处理gif,jpg,jpeg,png,svg这些类型的图片,use对应的数组里面不是字符串,而是对象,因为对象里面可以用options进行更细分的原创 2021-01-15 23:01:16 · 274 阅读 · 0 评论