Question

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

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

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

然后我得到两个单独的引用时刻。

如何设置它以便我可以将时刻与时区和范围功能结合使用？

谢谢！

Answer 1

Docs显示了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'的其他版本。如果你有正确的，你应该能够这样做：

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

请注意，只有在测试它的正确设置时，您应该像在glortho的回答中一样使用它：

DECLARE @xml XML;
SET @xml = CONVERT(XML, N'
<recipe>
    <parameters>
        <parameter name="a" desc="A">ValueA</parameter>
        <parameter name="b" desc="B">ValueB</parameter>
        <parameter name="c" desc="C">ValueC</parameter>
    </parameters>
</recipe>
');
SET @xml.[modify]('delete (/recipe/parameters/parameter/@desc)');
SELECT  @xml;

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（与我认为的OP相同）和React的webpack。我需要时区的功能。在添加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'

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

7 个答案: