Question

我正在使用 WebPack 4 构建我的 TypeScript 应用程序。

我的一个模块使用moment-timezone库，例如...

import * as moment from 'moment-timezone';
$('#label-locale').text(moment.locale());

这可以按预期工作。

为了更好地利用缓存，我想引用 Content Delivery Network（CDN）中的moment和moment-timezone，并将以下内容添加到我的{{ 1}}页：

HTML

我还对<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment-with-locales.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.23/moment-timezone-with-data.min.js"></script>进行了如下修改：

webpack.config.js

现在，当我运行代码时，出现以下错误：

module.exports = {
    externals: {
        'jquery': 'jQuery',
        'moment': 'moment-timezone'
    }
};

我是 WebPack 的新手，曾经尝试过将ReferenceError: timezone is not defined添加到'timezone': 'moment-timezone'的事情，但是没有成功。

非常感谢您的帮助/指导。

Answer 1

我想得太多了。 moment-timezone实际上“只是”扩展了moment对象以包括moment.tz，所以我要做的就是如下修改webpack.config.js：

module.exports = {
    externals: {
        'jquery': 'jQuery',
        'moment-timezone': 'moment'
    }
};

因此，不是WebPack有效地从node_modules/moment-timezone构建{em}的整个定义树，而是moment对象已经由CDN参考进行了更新。至少，我认为这是正在发生的事情。

使用Moment TimeZone CDN配置WebPack

1 个答案: