如何解决Angular 6/7中的“ Uncaught ReferenceError:在模块../src/main.ts中未定义abp”错误?

时间:2019-01-22 14:31:37

标签: angular typescript aspnetboilerplate

我将Asp Net Zero模板项目从2逐步升级到了版本7。我已经设法在Angular版本5上运行了该应用程序,而无需付出太多努力。但是,在将应用程序的客户端项目升级到Angular 7之后,我在应用程序启动时收到此错误;

Uncaught ReferenceError: abp is not defined
    at Module../src/main.ts (main.js:56933)
    at __webpack_require__ (runtime.js:79)
    at Object.0 (main.js:112364)
    at __webpack_require__ (runtime.js:79)
    at checkDeferredModules (runtime.js:46)
    at Array.webpackJsonpCallback [as push] (runtime.js:33)
    at main.js:1

我遵循了Angular更新工具在此处建议的步骤; https://update.angular.io/。 Angular创建了angular.json文件,并在整个客户端项目中进行了必要的更改。我只在type.d.ts文件中注释掉“ LocalForage”包部分,因为此库上有多个扩展错误。我认为LocalForage在node_modules中的自己的文件夹中添加了自己的类型,并且与此文件冲突。

我尚未对main.ts文件进行任何更改,但对“ tsconfig.json”文件进行了几处更改。这些分别是“ main.ts”和“ tsconfig.ts”文件;

import './polyfills.ts';

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode, ChangeDetectorRef } from '@angular/core';
import { environment } from './environments/environment';
import { AccountModule } from './account/account.module';
import { AppConsts } from './shared/AppConsts';
import { AppPreBootstrap } from './AppPreBootstrap';
import { AppModule } from './app/app.module';

import * as moment from 'moment';

import 'moment/min/locales.min';
import 'moment-timezone';

if (environment.production) {
    enableProdMode();
}

abp.ui.setBusy();
AppPreBootstrap.run(() => {
    if (abp.session.userId) {
        AppPreBootstrap.bootstrap(AppModule).then(() => {
            abp.ui.clearBusy();
        });
    } else {
        $('body').attr('class', 'page-md login');
        AppPreBootstrap.bootstrap(AccountModule).then(() => {
            abp.ui.clearBusy();
        });
    }
});

//A workaround to make angular-cli finding the startup module!
var b = false; if (b) { platformBrowserDynamic().bootstrapModule(AccountModule); }
{
  "include": [
    "../src/**/*",
    "../node_modules/abp-ng2-module/src/**/*",
    "../node_modules/abp-web-resources/Abp/Framework/scripts/**/*" // This line doesn't make any difference. Tried with commented out as well.
  ],
  "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [ "es6", "dom" ],
    "mapRoot": "./",
    "module": "es6",
    "moduleResolution": "node",
    "outDir": "../dist/out-tsc",
    "sourceMap": true,
    "target": "es5",
    "typeRoots": [
      "../node_modules/@types"
    ],
    "baseUrl": ".",
    "paths": {
      "@abp/*": [ "../node_modules/abp-ng2-module/dist/src/*" ],
      // "@abp/*": [ "../node_modules/abp-ng2-module/src/*" ],
      "@app/*": ["./app/*"],
      "@shared/*": ["./shared/*"],
      "@node_modules/*": ["../node_modules/*"]
    }
  },
  "exclude": [
    "node_modules"
  ]
}

我已根据我在项目存储库中看到的GitHub问题添加了“包含”和“排除”部分。我还尝试了这些部分的注释版本,以防万一它们出现问题,但我认为这无关紧要。我也尝试过使用'“ @ abp / ”:[[../ node_modules / abp-ng2-module / dist / src / “],'带有和不带dist文件夹的行的应用程序路径。

当我转到“ abp”的定义时,我可以导航到“ abp-web-resources”包中的abp.d.ts文件,该文件包含在应用程序的node_modules文件夹中。因此编译过程中没有错误。在浏览器中输入“ localhost:4200”时出现错误。我添加了几个gist链接,以防有人想要检出更改的部分,因为我能够在Angular 5上正确运行该应用程序。我对Angular的最新版本没有太多的经验。我的猜测是,我需要更改有关在应用程序内部引用节点包的某些内容,并且我相信这不会是我在运行时遇到的唯一错误。预先感谢。

要害链接

package.json-Angular 7:https://gist.github.com/alpersilistre/b83483cf84ff7530f684fa4f387dd573
package.json-角度5:https://gist.github.com/alpersilistre/7e5c31fb8617564c113c882cb2930896

angular.json-Angular 7:https://gist.github.com/alpersilistre/6eb901f1754339f48a52cbb7a77445ce
angular-cli.json-Angular 5:https://gist.github.com/alpersilistre/13098f660baaa6327ec4c246eef59f2a

0 个答案:

没有答案