当前,我需要将两个语言按钮(两个锚点)作为静态页面(英语和荷兰语)加载。因此,例如,当有人单击eng时,应该加载index-en.html的静态页面,如果他们单击nl,则index-nl.html的页面将显示为静态页面。现在,该页面将index-en.html显示为主页,但问题是所有html页面都应从一个样式表中加载其样式。
const Path = require('path');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: {
app: Path.resolve(__dirname,'../src/scripts/index.js')
},output: {
path: Path.join(__dirname,'../build'),filename: 'js/[name].js'
},optimization: {
splitChunks: {
chunks: 'all',name: false
}
},plugins: [
new CleanWebpackPlugin(),new CopyWebpackPlugin([
{ from: Path.resolve(__dirname,'../public'),to: 'public' }
]),new HtmlWebpackPlugin({
template: Path.resolve(__dirname,'../src/index-en.html'),chunk: ['app']
}),'../src/index-nl.html'),],resolve: {
alias: {
'~': Path.resolve(__dirname,'../src')
}
},module: {
rules: [
{
test: /\.mjs$/,include: /node_modules/,type: 'javascript/auto'
},{
test: /\.(ico|jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2)(\?.*)?$/,use: {
loader: 'file-loader',options: {
name: '[path][name].[ext]'
}
}
},]
}
};