如何防止时刻.js使用webpack加载语言环境？

javascript momentjs webpack gulp

2022-08-30 01:09:44

当你使用webpack时，有什么方法可以阻止加载所有区域设置（我只需要英语）吗？我正在查看源代码，似乎如果定义了webpack，那么它总是尝试每个区域设置。我很确定这需要一个拉取请求来修复。但是有没有办法用webpack配置来解决这个问题呢？moment.jshasModulerequire()

这是我的webpack配置来加载时刻js：

resolve: {
            alias: {
                moment: path.join(__dirname, "src/lib/bower/moment/moment.js")
            },
        },

然后，无论我在哪里需要它，我都会这样做。这有效，但它向我的捆绑包中添加了大约250 kB的不需要的语言文件。此外，我正在使用bower版本的momentjs和gulp。require('moment')

此外，如果 webpack 配置无法修复此问题，则此处是指向加载语言环境的函数的链接。我试图添加到语句中，但我想webpack实际上并没有以一种可行的方式工作。没关系。我认为它现在使用正则表达式，所以我真的不知道你会如何修复它。&& module.exports.loadLocalesifrequire

答案 1

代码可以使用 dir 中的每个文件。因此，webpack将每个文件作为模块包含在捆绑包中。它无法知道您正在使用哪种语言。require('./locale/' + name)locale

有两个插件可用于为 webpack 提供有关捆绑包中应包含哪个模块的更多信息：和 .ContextReplacementPluginIgnorePlugin

require('./locale/' + name)称为上下文（包含表达式的 require）。webpack 从以下代码片段中推断出一些信息：目录和正则表达式。这里：。因此，默认情况下，目录中的每个文件都包含在内。directory = ".../moment/locale"regular expression = /^.*$/locale

允许覆盖推断的信息，即提供新的正则表达式（选择要包含的语言）。ContextReplacementPlugin

另一种方法是忽略带有 .IgnorePlugin

下面是一个示例：

var webpack = require("webpack");
module.exports = {
  // ...
  plugins: [
    new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /de|fr|hu/)
    // new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
  ]
};

答案 2

在我们的项目中，我包括这样的时刻：这似乎可以解决问题。不过，我们对时刻的使用非常简单，所以我不确定SDK是否会有任何不一致。我认为这有效，因为WebPack不知道如何静态地查找区域设置文件，因此您会收到警告（通过在中添加空文件夹很容易隐藏），但没有区域设置包含。import moment from 'moment/src/moment';moment/src/lib/locale/locale