javascript – 設定 webpack 壓縮 JS 文檔
webpack.config.js
const webpack = require('webpack'); const path = require('path'); const UglifyJSPlugin = require('uglifyjs-webpack-plugin'); module.exports = { watch: true, // development | production mode: 'production', entry: { 'jquery.vmodel': './src/index.js' }, output: { path: path.resolve(__dirname, 'dist'), filename: '[name].min.js' }, devtool: 'source-map', plugins: [ new UglifyJSPlugin({ sourceMap: true }) ] };
建議啟用 devtool: ‘source-map’,可以幫助錯誤報告不會指向 min.js 而是指向開發文件的 .js 。
透過 entry 指定,我將 「./src/index.js」壓縮成 「.dist/jquery.vmodel.min.js」。
進入點 index.js 可以透過 inport 引入不同的 JS 開發文件,達到將多個 JS 依序壓縮成 min.js 檔。例如我的 index.js 長這樣:
import './jquery.vmodel.init.js'; import './jquery.vmodel.api.js'; import './jquery.vmodel.version.js'; import './jquery.vmodel.end.js'; import './jquery.vmodel.history.js'; import './jquery.vmodel.get.js'; import './jquery.vmodel.delete.js'; import './jquery.vmodel.create.js'; import './jquery.vmodel.fn.js';