使用webpack导入moment-timzone和moment-range（Babel / ES6）

Question

我正在使用带有Babel加载器的Webpack。 按ES6标准编写。 我已经用npm安装了时刻 - 时区和时刻 - 范围。

这两个都是moment.js插件，这两个都取决于当前的包，并导出一个单独的时刻库。 所以，当我这样做

import moment from 'moment-timezone';
import moment2 from 'moment-range';

然后我得到两个单独的参考时刻 。

我该如何设定，让我可以使用瞬间与时区和范围的功能呢？

谢谢！

Answer 1

文档为此显示了CommonJS语法：

var moment = require('moment');
require('moment-range');
require('moment-timezone');

// moment() now has both range and timezone plugin features

在ES6中：

import moment from 'moment';
import 'moment-range';
import 'moment-timezone';

编辑

由于moment-timezone并没有扩展现有的导入，但确实延长了moment本身，那么这个呢？

import moment from 'moment-timezone';
import 'moment-range';

Answer 2

我用不同的包装解决了这个问题： moment-timezone和frozen-moment 。 所有邪恶的根源是在树的不同部分有两个moment依赖。 就我而言，我不得不moment右下node_modules也内frozen-moment的node-modules 。 这意味着moment-timezone和frozen-moment正在使用不同的moment实例。

检查您是否使用彼此兼容的软件包版本，以便moment-range不需要获取不同版本的moment 。 如果你有正确的，你应该能够这样做：

import moment from 'moment';
import momentTimezone from 'moment-timezone';
import momentRange from 'moment-range';

console.log(moment === momentTimezone === momentRange); // logs 'true'

请记住，仅用于测试它的正确设置，您应该像在glortho的答案中那样使用它：

import moment from 'moment';
import 'moment-timezone';
import 'moment-range';

Answer 3

所有上述解决方案对我都不起作用，我不得不求助于此：

import moment from 'moment';
window.moment = moment;
import {extendMoment} from 'moment-range';
extendMoment(window.moment);

有点hacky但有效。

Answer 4

我发现时刻范围的默认实现非常难看，因为它只是扩展了时刻对象，而IMO则有点“hacky”。

这就是我这样做的方式：

import { default as DateRange } from 'moment-range';

const myRange = new DateRange(x, y);

Answer 5

我设法用以下代码导入moment-timezone和moment-range ：

import Moment from 'moment-timezone';
import momentRange from 'moment-range';

const moment = momentRange.extendMoment(Moment);

Answer 6

我的项目使用带有ES6的webpack（与我认为的OP相同）和React。 我需要从时刻到时区的功能。 添加moment和moment-timezone npm依赖项后，此import语句有效：

import moment from 'moment-timezone';

这让我可以像moment.tz.guess();

什么真的让我失望 - 只是添加导入并没有在我的浏览器的开发控制台中提供moment 。 通过在评论中去https://github.com/moment/moment/issues/2608 ，有人提到了这个片段，这使得moment可供开发控制台：

window.moment = moment;

Answer 7

这对我有用

import * as moment from 'moment-timezone'
import * as momentRange from 'moment-range'