TypeScript 编译器省略了导入的 angular-translate 模块答案

【问题标题】：TypeScript Compiler omits imported angular-translate moduleTypeScript 编译器省略了导入的 angular-translate 模块
【发布时间】：2016-10-22 00:38:03
【问题描述】：

我正在将 Angular 1.5 项目转换为 TypeScript，但在导入 angularTranslate 时遇到了问题。

我尝试像这样导入angular 和angular-translate：

import * as angular from "angular";
import * as angularTranslate from "angular-translate";

console.log(angular, angularTranslate);

我正在使用从DefinitelyTyped/angular-translate.d.ts 安装的类型。

当我使用 TypeScript 1.8 (module: "commonjs") 编译时，它会发出这个 JavaScript：

"use strict";
var angular = require("angular");
console.log(angular, angularTranslate);

如您所见，即使引用了 angularTranslate 导入，它也已删除，并且保留了类似使用的 angular 导入。这会导致运行时错误ReferenceError: angularTranslate is not defined。这适用于 Babel。我应该如何导入angularTranslate？

编辑：

这也不会发出任何信号：

import angularTranslate = require("angular-translate");

但这会发出预期的输出：

let angularTranslate = require("angular-translate");

angular-translate module 是否有问题导致无法在 TypeScript 中与import 一起使用？

【问题讨论】：

你试过普通的import "angular-translate";（建议here）吗？
我认为问题在于“angular-translate”模块导出了一个命名空间。
我没有尝试导入作为副作用，这可能会阻止导入被剥离，但是我无法引用导入的模块。
@AlekseyL。有趣，所以基本上打字是错误的？使用 Babel 时，我发现 import angularTranslate from "angular-translate" 确实给了我预期的字符串 "pascalprecht.translate" 用于 angular 的依赖注入器，只是 TypeScript 没有通过编译步骤保留它。有解决办法吗？
This pull request 似乎是我（和其他人）问题的根源。

标签： angularjs typescript typescript1.8

【解决方案1】：

angular 1.5 不支持 JS 和 UMD 的模块结构（它有自己的模块系统）。因此，如果您从“角度”导入某些内容，那么您只是从环境模块声明中导入定义类型文件的类型，并且打字稿转译器能够识别出不需要向结果 JS 发出 CommonJS 导入定义（仅导入声明）。但是，如果您通过 CommonJS 所需语法（或通过 ES6 导入“模块”）直接定义导入，则您会创建副作用导入，该导入会在模块加载器或捆绑器加载所需模块时执行 Angular 脚本。

【讨论】：

感谢您的回复，但事实并非如此。 Angular 1.5 可以与 ES6 模块一起使用，这就是我使用它的方式并且它可以工作。大多数第 3 方 Angular 库都会导出 Angular 依赖项名称，因此您只需导入名称即可。事实上，即使angular-translate 也是这样工作的，而且它适用于 Babel，只是不适用于 TypeScript。我知道 Babel 有一些神奇的模块兼容层，但即使在 TypeScript 中，我所有的其他 3rd 方角度库都以这种方式工作，angular-translate 除外。为什么？
你好朋友，我同意你的观点，但你不理解我，我尽力向你解释，为什么当编译器识别出你只导入类型时 TypeScript 不发出一些导入（接口）。情况不同，当已解析的模块（在您的情况下为环境模块）导出一些常量、值或函数（甚至是构造函数）时，您不会让转译器有机会跳过此类导入。我认为在 angular-trnaslate 问题的情况下是在导出类型别名时，但我当然不确定。所以自己使用副作用导入或热修复角度翻译定义类型文件....

【解决方案2】：

问题是“角度翻译”模块导出了一个命名空间。作为临时解决方案，您可以参考旧版本的 angular-translate.d.ts 或 fork 并手动修复它。

【讨论】：

【解决方案3】：

// 导入角度平移

import angularTranslate from 'angular-translate';

那么不要使用引号：

var app = angular.module('myApp', [angularTranslate]);

【讨论】：