Angular 对角度2'使用上卷；s AoT编译器和导入矩.js

我试图遵循Angular 2的规则，并且在我的应用程序中使用Moment.js。Moment.js在我的packages.json文件中，我使用的是2.15.0版。到目前为止，我一直是这样导入的：

import * as moment from 'moment';

但是，当我到达必须运行rollup的部分时，我会出现以下错误：

无法调用命名空间（'时刻'）

这似乎与我输入力矩的方式有关。那么，我该怎么做呢？ 我似乎无法以任何其他方式导入这一时刻。如果我使用

import moment from 'moment'

我得到了编译错误

外部模块“时刻”没有默认导出

从2.13.0版开始

---

import*作为“时刻”的时刻
经过，
从“时刻”导入时刻应该可以工作。
我终于设法消除了这两个错误。确实要避免：

无法调用命名空间（'时刻'）

您需要使用：

从“时刻”导入时刻

那么要避免

“时刻”没有默认导出

您必须将以下内容添加到tsconfig.json（编译器选项）中：

“allowSyntheticDefaultImports”：true

编辑2016年11月17日

我还必须在rollup-config.js文件中添加以下内容：

plugins: [
  nodeResolve({jsnext: true, module: true}),
  commonjs({
    include: [
        'node_modules/rxjs/**',
        'node_modules/moment/**'
      ]
    }
  }),
  uglify()
]

我遇到了上述同样的问题

import*作为“时刻”的时刻-在通过systemjs开发和加载时工作，但在汇总期间不工作

从“时刻”导入时刻-在汇总生成中工作，但在开发期间不工作

为了避免必须根据构建类型更改代码，我只是将moment添加为一个全局函数，并创建了一个助手函数，在需要使用它的任何地方导入它，而不是导入moment

这意味着相同的代码适用于两种类型的场景。虽然不是特别漂亮，但如果有更好的方法，请让我/我们知道

这是helper函数，添加到它自己的文件
momentLoader.ts

import { default as mom } from 'moment';
export default function moment(args?: any): mom.Moment {
    let m = window["moment"];
    if (!m) { 
        console.error("moment does not exist globally.");
        return undefined;
    }
    return m(args);
}

要在其他类中使用矩，我只需导入函数并调用它，就像直接导入矩一样：

从'../../momentLoader'导入力矩

d=moment（）.utc（“1995-12-25”）

设m=力矩（“1995-12-25”）

为了让systemjs将其作为全局文件加载，我只需遵循以下步骤。

在我的例子中，systemjs的瞬间配置如下所示：

let meta = {
    'lib:moment/moment.js': { format: 'global' }
};

System.config({
    paths: paths,
    map: map,
    packages: packages,
    meta: meta
});

System.import('lib:moment/moment.js');

对于汇总构建，您必须确保通过脚本标记将moment.js添加到页面的某个位置，因为很遗憾，它不会包含在汇总构建文件中。
下面是我使用typescript（2.1.6）和汇总（0.41.4）创建work moment的步骤

要导入力矩，请保持标准方式：

import*作为“时刻”的时刻

从“时刻”导入时刻
对于没有默认导出的包来说是非标准的，它将在运行时导致错误：
moment_1。默认值不是函数

在typescript中，将“瞬间”与“按施法瞬间”一起使用，并调用
default
函数：

var momentFunc = (moment as any).default ? (moment as any).default : moment;
var newFormat = momentFunc(value).format( format );

 import * as svgPanZoom from 'svg-pan-zoom';
 svgPanZoom(element); <== error: Cannot call a namespace


矩（值）。format（format）
将在汇总树抖动时导致错误：
无法调用名称空间（“矩”）
我找到了解决当前问题的好方法：

Npm安装提供默认导出的附加包。
然后从“矩-es6”导入，而不是从“矩”导入：

从“力矩-es6”导入力矩


要与systemjs一起使用，请将以下内容添加到systemjs.config.js映射部分：
'矩-es6'：'npm:矩-es6/index.js'

将
'node\u modules/moment-es6/**'
添加到汇总配置commonjs部分的
包含
（汇总插件commonjs）

我们在ng Packager中遇到了类似的问题，它使用汇总生成可以在npm回购中发布的模块。
我们的项目是使用@angular cli（使用网页包）构建的

我们使用asteriks方法导入了2个依赖项：

 import * as dataUrl from 'dataurl';

工作良好，使用方式如下：

 dataUrl.parse(url)

另一个导入出现错误（无法调用命名空间），因为导出的对象将用作函数：

var momentFunc = (moment as any).default ? (moment as any).default : moment;
var newFormat = momentFunc(value).format( format );

 import * as svgPanZoom from 'svg-pan-zoom';
 svgPanZoom(element); <== error: Cannot call a namespace

我们还进行了如上所述的tsconfig.json配置更改

版本：
ng包装：1.4.1
汇总：0.50.0
打字稿：2.3.5
@角度/cli:1.4.8
网页：3.7.1

希望这有帮助,

Rob
我尝试了上述所有解决方案，但没有一个对我有效。起作用的是

import moment from 'moment-with-locales-es6';

在我的Angular 5（5.2.9）项目（从Ng2升级而来）中使用momentJs（2.24）时遇到了同样的问题，该项目为prod build提供了Gulp和Rollup（0.58.0）

正如前面提到的，
import*As moment from'moment'
仅适用于在包列表中引用momentJs的deving（通过SystemJS）：

{
  name: 'moment',
  path: 'node_modules/moment/min/moment.min.js'
}

另一种情况是汇总使用（生产构建）——momentJs的代码作为ES6模块（在矩/src中），但它以不同的方式导出（然后是通常的导出）。
这就是为什么
从“时刻”导入时刻适用于汇总的

include: [
  'node_modules/rxjs/**',
]

和ES6模块导入

是的，使用ES6包装器（例如
矩-ES6
等等）是一个简单的解决方案。但它总是需要时刻。
同时，对于这个问题还有一个更简单的解决方案-将您的导入行从Dev替换为Prod。
例如，Gulp可以在以下步骤中使用
Gulp replace
：

return gulp.src([
     ...
    ])
    .pipe(replace('import * as moment from \'moment\';', 'import moment from \'moment\';'))
     ...;

这使得模块[…]没有导出的成员“default”。您能解决这个问题吗？+1与“highcharts/highcharts more”中的“highcharts”与“highcharts more”中的“highcharts导入*”有相同的问题；Highcharts更多（Highcharts）
我也遇到了同样的错误。一个月后你们方面有什么进展吗？我在加载的时候也遇到了问题。。看到这个答案，可能会有所帮助：这适用于AoT汇总配置，但在调试/开发构建模式下使用systemjs不起作用。@MarkPerry是的，我还在尝试systemjs和Webpack。但这条线是关于罗尔的