webpack的I18n和pug怎么配置呢?
webpack.config.js:
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const I18nPlugin = require("i18n-webpack-plugin");
const pug = {
test: /\.pug$/,
use: ['html-loader?attrs=false', 'pug-html-loader']
};
const languages = {
en: require("./lang/en.json"),
zh: require("./lang/zh.json")
};
const config = Object.keys(languages).map(function(language){
return {
name: language,
entry: './src/app.js',
output: {
path: path.resolve(__dirname, 'build'),
filename: language + '.bundle.js'
},
devServer: {
},
module: {
rules: [pug]
},
plugins: [
new webpack.BannerPlugin("asddas"),
new HtmlWebpackPlugin({
filename: 'index.html',
template: './src/pug/index.pug',
inject: false
}),
new I18nPlugin(languages[language])
]
}
});
module.exports = config;
入口文件app.js:
console.log(__("title"))//这里的console.log可以成功被浏览器打印
编译后HTML:
<!DOCTYPE html>
<html>
<head>
<title>I'm a title</title>
</head>
<body><h1>__("title")</h1>
<script src="en.bundle.js"></script>
//这里是手动加的,html里__("title")无法读取语言包里的内容
</html>
可以成功将pug打包生成html文件,但是语言包怎么加载呢?用script引入zh.bundle.js但是没有效果,在编译后的html内怎么读取文本呢?
求大大解惑,非常感谢
全部文件在百度云链接里
链接:https://pan.baidu.com/s/1q_lf...
提取码:nq16
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论