Webpack TypeScript和xgettext翻译

Question

我有一个Django应用程序，正在使用Django的i18n模块来帮助翻译我的字符串。为了翻译JavaScript，我运行

python manage.py makemessages -d djangojs

它将所有标记字符串添加到.po文件中。这对于我的静态文件夹中所有无聊的.js文件来说都很好。然而，我们开始使用webpack将一些类型记录(.tsx文件)打包到bundle.js文件中。此文件在构建后被复制到静态文件夹中，因此我希望Djangos makemessages也能从其中提取字符串。但是，似乎没有正确地解析字符串，因为bundle.js中的大多数代码只是包装在eval()中的字符串。

我相信这意味着，除了bundle.js文件之外，我还需要webpack为每个.tsx文件创建一个.js文件，而不需要所有的eval()废话，这样django的makemessages就可以正确地解析它。不过，我不知道该怎么做。我的当前配置如下

var path = require("path");
var WebpackShellPlugin = require('webpack-shell-plugin');

var config = {
    entry: ["./src/App.tsx"],

    output: {
        path: path.resolve(__dirname, "build"),
        filename: "bundle.js"
    },

    devtool: 'source-map',

    resolve: {
        extensions: [".ts", ".tsx", ".js"]
    },

    module: {
        rules: [
            {
                test: /\.tsx?$/,
                loader: "ts-loader",
                exclude: /node_modules/
            },
            {
            test: /\.scss$/,
                use: [{
                    loader: "style-loader" // creates style nodes from JS strings
                }, {
                    loader: "css-loader" // translates CSS into CommonJS
                }, {
                    loader: "sass-loader" // compiles Sass to CSS
                }]
            },
            {
                test: /\.css$/,
                loader: 'style-loader!css-loader'
            }
        ]
    },

    plugins: [
        new WebpackShellPlugin({
            onBuildEnd:['./cp_to_static.sh'],
            dev: false  // Needed to trigger on npm run watch
        })
    ]
};

module.exports = config;

• 那么我怎么能让webpack把这些文件吐出来呢？
• 这是正确的做法，还是有办法使Django正确地解析bundle.js？

Answer 1

事实证明，所有这些无意义的内容都是由webpacks "watch“函数生成的。当简单地运行webpack来构建脚本时，它会像预期的那样工作。