如何解决ParseError：导入UpgradeAdapter时，'import'和'export'可能只出现'sourceType：module'？

Question

我正在尝试将现有的anguar.js应用升级到角度2，跟随https://angular.io/docs/ts/latest/guide/upgrade.html。

该应用程序已经使用Typescript编写，我们正在使用browserify和tsify来编译和捆绑应用程序。

在使用npm安装angular 2依赖项并尝试引导混合应用程序后，browserify会给我以下错误：

/my-project/node_modules/@angular/upgrade/static.js:8
export { downgradeComponent } from './src/aot/downgrade_component';
^
ParseError: 'import' and 'export' may appear only with 'sourceType: module'

添加以下代码后才会显示错误：

import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {AppModule} from './app.module';
import {UpgradeModule} from '@angular/upgrade/static';

platformBrowserDynamic().bootstrapModule(AppModule).then(platformRef => {
    const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule;
    upgrade.bootstrap(document.documentElement, ['sagaDesktopApp']);
});

这是我的tsconfig.json：

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": false,
        "suppressImplicitAnyIndexErrors": true
    }
}

非常感谢任何帮助。

Answer 1

我已经复制了这个问题。这与@angular/upgrade中存在@angular/upgrade/static文件并且当浏览器尝试解析node_modules/@angular/upgrade/static.js 时解析为：

有关

node_modules/@angular/upgrade/static/package.json

但是，其意图是解决：

package.json

static目录中的main包含{ES}捆绑包（如Browserify）使用的import { UpgradeModule } from '@angular/upgrade/static/'; 条目。

Browserify模仿并且它应该在目录之前检查文件，因此要修复问题，请在导入后附加一个斜杠：

package.json

然后，Browserify将首先检查目录，并将package.json解析为捆绑包。

如果您有兴趣，可以在Node's module resolution mechanism中了解main文件module / {{1}}内容的更多信息。