課程
/前端開發
/前端工具
/webpack深入與實戰
如果項目中有幾十個頁面，難道要搞個幾十個webpackhtmlplugin的配置，寫寫都會煩死吧
2017-07-23
源自：webpack深入與實戰 3-3
正在回答
就目前而言webpack4.0里面的確沒有處理的屬性，其實可以，自己寫個生成多頁面的配置文件page.js,里面講頁面的配置項寫好，然后動態生成多個new htmlWebpackPlugin()，這樣就可以只關注頁面的配置，然后頁面的配置文件可以合理的處理，比如抽調公共的配置屬性、進行設置等。
同問，不是老哥是否解決這個問題，按理說大牛應該是可以想到這個場景的
處理多個文件：可以通過僅修改?entry?對象來指定任意數量的 entry 或 output 點。
JavaScript 代碼:
const path = require('path');const webpack = require('webpack');module.exports = {context: path.resolve(__dirname, './src'),entry: {app: ['./home.js', './events.js', './vendor.js'],},output: {path: path.resolve(__dirname, './dist'),filename: '[name].bundle.js',},};
多個文件，多個輸出
const path = require('path');const webpack = require('webpack');module.exports = {context: path.resolve(__dirname, './src'),entry: {home: './home.js',events: './events.js',contact: './contact.js',},output: {path: path.resolve(__dirname, './dist'),filename: '[name].bundle.js',},};
這是webpack2
這是步好棋 提問者
舉報
webpack實戰教程，用真實項目帶你探索 webpack 強大的功能
2 回答這個問題怎么解決..輸入webpack時,提示沒有webpack.config.js文件
1 回答問題已解決
2 回答這個是webpack版本問題嗎？怎么解決
2 回答[關于postcss-loader問題的有效解決方案]
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
<strike id="feicz"></strike>
2019-07-08
就目前而言webpack4.0里面的確沒有處理的屬性，其實可以，自己寫個生成多頁面的配置文件page.js,里面講頁面的配置項寫好，然后動態生成多個new htmlWebpackPlugin()，這樣就可以只關注頁面的配置，然后頁面的配置文件可以合理的處理，比如抽調公共的配置屬性、進行設置等。
2018-03-15
同問，不是老哥是否解決這個問題，按理說大牛應該是可以想到這個場景的
2017-07-27
處理多個文件：可以通過僅修改?entry?對象來指定任意數量的 entry 或 output 點。
JavaScript 代碼:
const path = require('path');const webpack = require('webpack');module.exports = {context: path.resolve(__dirname, './src'),entry: {app: ['./home.js', './events.js', './vendor.js'],},output: {path: path.resolve(__dirname, './dist'),filename: '[name].bundle.js',},};
多個文件，多個輸出
JavaScript 代碼:
const path = require('path');const webpack = require('webpack');module.exports = {context: path.resolve(__dirname, './src'),entry: {home: './home.js',events: './events.js',contact: './contact.js',},output: {path: path.resolve(__dirname, './dist'),filename: '[name].bundle.js',},};
這是webpack2