角7:未捕获的ReferenceError:添加包时未定义全局 [英] Angular 7: Uncaught ReferenceError: global is not defined when adding package

问题描述

我正在构建一个Angular 7应用程序，当我添加一个包npm install dragula --save并将其导入到pollyfills.ts文件中时，出现此错误:

I am building an Angular 7 app, and when i add a package npm install dragula --save and import this into the pollyfills.ts file i get this error:

index.js:2未捕获的ReferenceError:全局未定义 在Object ../node_modules/custom-event/index.js(index.js:2) 位于 webpack_require (引导程序:83) 在Object ../node_modules/crossvent/src/crossvent.js(crossvent.js:3) 位于 webpack_require (引导程序:83) 在Object ../node_modules/dragula/dragula.js(dragula.js:4) 位于 webpack_require (引导程序:83) 在Module ../src/polyfills.ts(polyfills.ts:1) 位于 webpack_require (引导程序:83) 在Object.1(polyfills.ts:92) 在 webpack_require (bootstrap:83)

index.js:2 Uncaught ReferenceError: global is not defined at Object../node_modules/custom-event/index.js (index.js:2) at webpack_require (bootstrap:83) at Object../node_modules/crossvent/src/crossvent.js (crossvent.js:3) at webpack_require (bootstrap:83) at Object../node_modules/dragula/dragula.js (dragula.js:4) at webpack_require (bootstrap:83) at Module../src/polyfills.ts (polyfills.ts:1) at webpack_require (bootstrap:83) at Object.1 (polyfills.ts:92) at webpack_require (bootstrap:83)

当我用google搜索它时，每个人都说要将此(window as any).global = window;添加到pollyfills.ts中，我已经做到了，但仍然出现错误.我还准备删除node_modules文件夹，并且npm i我也已经完成了.

When I googled it everyone says to add this (window as any).global = window; to pollyfills.ts I have done this and I still get the error. I also ready to delete the node_modules folder and npm i I have done this as well.

我不知道还能在这里做什么.谁能告诉我一些建议或至少说明为什么会发生这种情况?

I do not know what else to do here. can anyone please tell me some sugestions or at least explain why this would happen?

这可能无关紧要，但我也要添加它.在将它们导入到pollyfills.ts

This may not be relevant but I'm going to add it as well. There is another error which wasnt there before I imported them into pollyfills.ts

accordion-group.component.ts:9未捕获的ReferenceError:全局不是 定义的 在Module ../src/app/components/accordion/accordion-group.component.ts (accordion-group.component.ts:9) 位于 webpack_require (引导程序:83) 在Module ../src/app/components/accordion/accordion.module.ts(accordion.component.ts:10) 位于 webpack_require (引导程序:83) 在Module ../src/app/shared/shared.module.ts(window.extensions.ts:15) 位于 webpack_require (引导程序:83) 在Module ../src/app/app.module.ts(app.constants.ts:17) 位于 webpack_require (引导程序:83) 在Module ../src/main.ts(main.ts:1) 在 webpack_require (bootstrap:83)

accordion-group.component.ts:9 Uncaught ReferenceError: global is not defined at Module../src/app/components/accordion/accordion-group.component.ts (accordion-group.component.ts:9) at webpack_require (bootstrap:83) at Module../src/app/components/accordion/accordion.module.ts (accordion.component.ts:10) at webpack_require (bootstrap:83) at Module../src/app/shared/shared.module.ts (window.extensions.ts:15) at webpack_require (bootstrap:83) at Module../src/app/app.module.ts (app.constants.ts:17) at webpack_require (bootstrap:83) at Module../src/main.ts (main.ts:1) at webpack_require (bootstrap:83)

推荐答案

几周前我遇到了类似的问题，当我现在在polyfills.ts中更改了几个沉降时，我就解决了它.

I had a similar problem few weeks ago, and I solve it when I change few setts in polyfills.ts now It look like:

/**
 * This file includes polyfills needed by Angular and is loaded before the app.
 * You can add your own extra polyfills to this file.
 *
 * This file is divided into 2 sections:
 *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
 *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
 *      file.
 *
 * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
 * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
 * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
 *
 * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
 */

/***************************************************************************************************
 * BROWSER POLYFILLS
 */

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
// import 'core-js/es6/symbol';
// import 'core-js/es6/object';
// import 'core-js/es6/function';
// import 'core-js/es6/parse-int';
// import 'core-js/es6/parse-float';
// import 'core-js/es6/number';
// import 'core-js/es6/math';
// import 'core-js/es6/string';
// import 'core-js/es6/date';
// import 'core-js/es6/array';
// import 'core-js/es6/regexp';
// import 'core-js/es6/map';
// import 'core-js/es6/weak-map';
// import 'core-js/es6/set';

/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import 'classlist.js';  // Run `npm install --save classlist.js`.

/** IE10 and IE11 requires the following for the Reflect API. */
// import 'core-js/es6/reflect';


/** Evergreen browsers require these. **/
// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
import 'core-js/es7/reflect';


/**
 * Required to support Web Animations `@angular/platform-browser/animations`.
 * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
 **/
import 'web-animations-js';  // Run `npm install --save web-animations-js`.

/**
 * By default, zone.js will patch all possible macroTask and DomEvents
 * user can disable parts of macroTask/DomEvents patch by setting following flags
 */

 // (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
 // (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
 // (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames

 /*
 * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
 * with the following flag, it will bypass `zone.js` patch for IE/Edge
 */
// (window as any).__Zone_enable_cross_context_check = true;

/***************************************************************************************************
 * Zone JS is required by default for Angular itself.
 */
import 'zone.js/dist/zone';  // Included with Angular CLI.



/***************************************************************************************************
 * APPLICATION IMPORTS
 */

(window as any)['global'] = window;

尝试此设置，让我知道.

Try with this setts and let me know.

还要在您的app.module.ts中查看-您是否以良好的方式导入了Dragula?

Look also in your app.module.ts - did you import Dragula in good way?

@NgModule({
    declarations: [
        ...
    ],
    imports: [
        ...
        DragulaModule.forRoot(),
        ...
    ],
    exports: [
        ...
    ],
    providers: [
       ...    ],
    bootstrap: [AppComponent]
})

请注意，这应该是您应用的主要app.module.ts，而不是任何子模块或延迟加载的模块.

Please note that this should be a main app.module.ts for your app, not any child or lazy loaded module.

这篇关于角7:未捕获的ReferenceError:添加包时未定义全局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！