我在使用 Webpack 時遇到問題。我正在使用一個 JS 檔案來呼叫一個 API，但是這個 API 應該只在 escudos.html 中呼叫，但是當我進行 Webpack 構建時，JS 檔案同時呼叫了 API（index.html、escudos.html）。我只希望 ./src/js/teams.js 在 escudos.html 中呼叫 API，而不是在 (index.html, escudos.html) HTML 中。
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: {
index: './src/js/index.js',
teams: './src/js/teams.js',
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'js/[name].bundle.js',
},
plugins: [
new HtmlWebpackPlugin({
filename: 'index.html',
template: './src/index.html',
}),
new HtmlWebpackPlugin({
filename: 'escudos.html',
template: './src/escudos.html',
}),
],
devServer: {
static: './dist',
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: { loader: 'babel-loader' },
},
],
},
};
由于某種原因，我webpacked index.html檔案有teams.js太
uj5u.com熱心網友回復：
問題（和解決方案）在 HtmlWebpackPlugin 中。默認情況下，HtmlWebpackPlugin 注入每個頁面中的所有條目。
我可以想到三種解決方案：
inject: false：這將禁用自動將<script>標簽注入模板。您必須<script>使用正確的 src手動撰寫標簽。（ps：不要）chunks: 指定要包含在此模板中的條目。EG：（解決了 OP 問題，在大多數情況下您將需要/使用什么）new HtmlWebpackPlugin({ template: "./src/index.html", chunks: ["index"] }), new HtmlWebpackPlugin({ template: "./src/escudos.html", chunks: ["teams"] })exclude：注入除此陣列中指定的條目之外的所有條目。例如new HtmlWebpackPlugin({ template: "./src/test.html", exclude: ["index"] })
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/375342.html
標籤：javascript 网络包
上一篇：這個C語言陳述句是什么意思？
下一篇：運行服務時“無法獲取/”