Как решить 'Uncaught ReferenceError: abp не определен в Ошибка модуля ../ src / main.ts' в Angular 6/7? - PullRequest
0 голосов
/ 22 января 2019

Я обновил свой шаблонный проект 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 и внес необходимые изменения в проект клиента. Я только закомментировал раздел пакета «LocalForage» в файле typing.d.ts, потому что в этой библиотеке была ошибка с несколькими расширениями. Я думаю, что 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.d.ts в пакете «abp-web-resources», который находится в папке node_modules приложения. Таким образом, нет ошибки при компиляции. Я получил ошибку при вводе localhost: 4200 в браузере. Я добавил несколько основных ссылок на тот случай, если кто-нибудь захочет проверить измененные детали, потому что я смог правильно запустить приложение на Angular 5. У меня мало опыта работы с последними версиями Angular. Я предполагаю, что мне нужно что-то изменить в ссылках на пакеты узлов внутри приложения, и я считаю, что это будет не единственной ошибкой, которую я получу во время выполнения. Заранее спасибо.

Суть ссылки

package.json - Угловой 7: https://gist.github.com/alpersilistre/b83483cf84ff7530f684fa4f387dd573
package.json - угловой 5: https://gist.github.com/alpersilistre/7e5c31fb8617564c113c882cb2930896

angular.json - Угловой 7: https://gist.github.com/alpersilistre/6eb901f1754339f48a52cbb7a77445ce
angular-cli.json - угловой 5: https://gist.github.com/alpersilistre/13098f660baaa6327ec4c246eef59f2a

...