208

moment.js当您使用 webpack 时,有什么方法可以停止加载所有语言环境(我只需要英语)?我正在查看源代码,似乎如果hasModule已定义,它是为 webpack 定义的,那么它总是会尝试require()每个语言环境。我很确定这需要一个拉取请求来修复。但是有什么办法可以通过 webpack 配置解决这个问题吗?

这是我加载momentjs的webpack配置:

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

然后在任何我需要它的地方,我就去做require('moment')。这可行,但它在我的包中添加了大约 250 kB 的不需要的语言文件。另外我正在使用momentjs和gulp的凉亭版本。

此外,如果 webpack 配置无法解决此问题,这里是指向加载 locales 的函数的链接。我尝试添加&& module.exports.loadLocalesif声明中,但我猜 webpack 实际上并不能以这种方式工作。require不管怎样。我认为它现在使用正则表达式,所以我真的不知道您将如何修复它。

4

6 回答 6

315

该代码require('./locale/' + name)可以使用目录中的每个文件locale。所以 webpack 将每个文件作为模块包含在你的包中。它无法知道您使用的是哪种语言。

两个插件有助于为 webpack 提供更多关于哪个模块应该包含在你的包中的信息:ContextReplacementPluginIgnorePlugin.

require('./locale/' + name)称为上下文(包含表达式的要求)。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$/)
  ]
};
于 2014-08-21T12:09:17.720 回答
8

在我们的项目中,我包含了这样的时刻:import moment from 'moment/src/moment';这似乎可以解决问题。不过,我们对 moment 的使用非常简单,所以我不确定是否会与 SDK 有任何不一致。我认为这是可行的,因为 WebPack 不知道如何静态查找语言环境文件,因此您会收到一个警告(通过在 处添加一个空文件夹很容易隐藏moment/src/lib/locale/locale)但不包含语言环境。

于 2016-05-11T20:22:32.153 回答
4

更新:2021 年
您可能还想签出许多其他库:

原始答案:
似乎永远不会出现moment正确的模块化库但是,我刚刚结束了使用https://github.com/ksloan/moment-mini之类的import * as moment from 'moment-mini';

于 2017-05-02T00:36:13.433 回答
2

根据 Adam McCrmick 的回答,您很接近,将您的别名更改为:

resolve: {
    alias: {
        moment: 'moment/src/moment'
    },
},
于 2016-10-20T03:06:16.067 回答
2

使用webpack2最新版本的时刻,您可以执行以下操作:

import {fn as moment} from 'moment'

然后在webpack.config.js你做:

resolve: {
    packageMains: ['jsnext:main', 'main']
}
于 2016-12-30T17:18:32.397 回答
1

这是在 NPM 安装程序中使用postinstall 脚本的另一个解决方案。

您可以在package.json文件中添加一行:

{
  "scripts": {
    ...
    "postinstall": "find node_modules/moment/locale -type f -not -name 'en-gb.js' -not -name 'pl.js' -printf '%p\\n' | xargs rm"
    ...
  }
}

npm install结果,不需要的语言环境将在完成安装包后立即被删除。

仅在我的情况下en-gbpl语言环境将保留在捆绑包中。

如果您已经有postinstall脚本,您可以将脚本添加到现有命令中:

{
  "scripts": {
    ...
    "postinstall": "previous_command && find node_modules/moment/locale -type f -not -name 'en-gb.js' -not -name 'pl.js' -printf '%p\\n' | xargs rm"
    ...
  }
}
于 2020-09-08T20:02:50.123 回答