webpack - 使用 Webpack 缩小 JS 文件
问题描述
我正在尝试使用 webpack 来缩小我所有的 js、.css、图像和字体文件。在研究 Webpack 时,我首先尝试使用 JS 文件。
在我的 js 文件夹中,我有文件 jquery-2.2.3.min.js、bootstrap.min.js、easing.js、move-top.js 和 SmoothScroll.min.js。
当我尝试运行 npm start 时,它会生成错误 Error: Conflict: Multiple chunks iss assets to the same filename principal.js (chunks jquery and bootstrap)。
下面是我的 webpack.config.js:
const webpack = require('webpack');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
mode: 'development',
entry: {
jquery: './js/jquery-2.2.3.min.js',
bootstrap: './js/bootstrap.min.js',
easing: './js/easing.js',
move_top: './js/move-top.js',
smooth_scroll: './js/SmoothScroll.min.js',
},
output: {
filename: 'default.js',
path: __dirname + '/public'
},
plugins: [
new MiniCssExtractPlugin({
filename: "style.css"
})
],
module: {
rules:[
{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
'css-loader'
]
},
{
test: /\.(png|svg|jpg|jpeg|gif)$/,
use: [
'file-loader'
]
}
]
}
}
解决方案
推荐阅读
- python-3.x - FutureWarning:pandas.util.testing 已弃用。改用 pandas.testing 的公共 API 中的函数
- google-cloud-storage - 具有特定路径例外的 Firebase 存储安全规则?
- python-3.x - Python3 二维数组
- javascript - 如何等待 QueryDocumentSnapshot.docs.forEach 结束返回
- python - 如何与开源项目共享我的环境变量?
- python - 插入到excel中的某些列
- javascript - Material-UI 导航、抽屉和 Flex
- apollo - ApolloClient:你如何处理缓存中的规范化/嵌套?
- php - 禁用多选html中的选定选项
- python - virtualenv:错误:需要以下参数:dest