angular: Unhandled Promise rejection: Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten. Most likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.) ; Zone: ; Task: Promise.then ;
This is my package.json
:
"dependencies": { "@angular/common": "~4.2.0", "@angular/compiler": "~4.2.0", "@angular/core": "~4.2.0", "@angular/forms": "~4.2.0", "@angular/http": "~4.2.0", "@angular/platform-browser": "~4.2.0", "@angular/platform-browser-dynamic": "~4.2.0", "@angular/router": "~4.2.0", "bootstrap": "^3.3.7", "bootstrap-notify": "^3.1.3", "concurrently": "^3.5.0", "cookie-parser": "^1.4.3", "core-js": "^2.4.1", "jquery": "^3.2.1", "newrelic": "^2.0.2", "node-uuid": "^1.4.8", "request": "^2.81.0", "rxjs": "5.0.1", "sha256": "^0.2.0", "x-frame-options": "^1.0.0", "zone.js": "^0.8.4" }, "devDependencies": { "@types/jasmine": "2.5.36", "@types/jquery": "^3.2.12", "@types/node": "^6.0.45", "angular2-template-loader": "^0.6.0", "awesome-typescript-loader": "^3.0.4", "chalk": "^2.1.0", "copy-webpack-plugin": "^4.0.1", "css-loader": "^0.26.1", "extract-text-webpack-plugin": "2.0.0-beta.5", "figures": "^2.0.0", "file-loader": "^0.9.0", "html-loader": "^0.4.3", "html-webpack-plugin": "^2.16.1", "jasmine-core": "^2.4.1", "karma": "^1.2.0", "karma-chrome-launcher": "^2.0.0", "karma-jasmine": "^1.0.2", "karma-sourcemap-loader": "^0.3.7", "karma-webpack": "^2.0.1", "null-loader": "^0.1.1", "raw-loader": "^0.5.1", "rimraf": "^2.5.2", "style-loader": "^0.13.1", "to-string-loader": "^1.1.5", "typescript": "~2.3.1", "webpack": "2.2.1", "webpack-dev-middleware": "^1.12.0", "webpack-dev-server": "2.4.1", "webpack-hot-middleware": "^2.18.2", "webpack-merge": "^3.0.0" }
This is my webpack.common.js: `const path = require(‘path’); const webpack = require(‘webpack’); const HtmlWebpackPlugin = require(‘html-webpack-plugin’); const CopyWebpackPlugin = require(‘copy-webpack-plugin’); const ExtractTextPlugin = require(‘extract-text-webpack-plugin’); const helpers = require(‘./helpers’); const project = require(‘…/project.config’);
console.log(project.config.ui); module.exports = { entry: { ‘polyfills’: ‘./src/polyfills.ts’, ‘vendor’: ‘./src/vendor.ts’, ‘app’: ‘./src/main.ts’ },
resolve: { extensions: [‘.ts’, ‘.js’], modules: [ ‘node_modules’, helpers.root(‘src’) ] },
module: { rules: [{ test: /.ts$/, loaders: [‘awesome-typescript-loader’, ‘angular2-template-loader’] }, { test: /.html$/, loader: ‘html-loader’ }, { test: /.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, loader: ‘file-loader?name=assets/[name].[hash].[ext]’ }, { test: /.css$/, exclude: helpers.root(‘src’, ‘app’), loader: [‘to-string-loader’].concat(ExtractTextPlugin.extract({ fallbackLoader: ‘style-loader’, loader: ‘css-loader?sourceMap’ })) }, { test: /.css$/, include: helpers.root(‘src’, ‘app’), loader: ‘raw-loader’ } ] },
plugins: [ /* * Plugin: CopyWebpackPlugin * Description: Copy files and directories in webpack. * * Copies project static assets. * * See: https://www.npmjs.com/package/copy-webpack-plugin */ new CopyWebpackPlugin([{ from: ‘src/assets’, to: ‘assets’ }, { from: ‘src/login.html’ } ]), // Workaround for angular/angular#11580 new webpack.ContextReplacementPlugin( // The (\|/) piece accounts for path separators in *nix and Windows /angular(\|/)core(\|/)@angular/, helpers.root(‘./src’), // location of your src {} // a map of your routes ),
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery'
}),
new webpack.DefinePlugin({
'ENV': JSON.stringify(process.env.NODE_ENV),
'CONFIG': JSON.stringify(project.config.ui)
}),
new webpack.optimize.CommonsChunkPlugin({
name: ['app', 'vendor', 'polyfills']
}),
new HtmlWebpackPlugin({
template: 'src/index.ejs',
title: 'Leasing Leads Management System',
chunksSortMode: 'dependency',
inject: 'body',
env: process.env.NODE_ENV
})
] };`
This is the webpack.config.js
:
`var webpack = require(‘webpack’);
var webpackMerge = require(‘webpack-merge’);
var ExtractTextPlugin = require(‘extract-text-webpack-plugin’);
var commonConfig = require(‘./webpack.common.js’);
var helpers = require(‘./helpers’);
const ENV = process.env.NODE_ENV = process.env.ENV = ‘production’;
module.exports = webpackMerge(commonConfig, { devtool: ‘source-map’,
output: { path: helpers.root(‘dist’), publicPath: ‘/’, filename: ‘[name].[hash].js’, chunkFilename: ‘[id].[hash].chunk.js’ },
plugins: [ new webpack.NoEmitOnErrorsPlugin(), new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618 mangle: { keep_fnames: true } }), new ExtractTextPlugin(‘[name].[hash].css’), new webpack.DefinePlugin({ ‘process.env’: { ‘ENV’: JSON.stringify(ENV) } }), new webpack.LoaderOptionsPlugin({ htmlLoader: { minimize: false // workaround for ng2 } }) ] });`
polyfills.ts
`import ‘core-js/es7/reflect’;
require(‘zone.js/dist/zone’);
if (process.env.ENV === ‘production’) { // Production } else { // Development and test Error[‘stackTraceLimit’] = Infinity; require(‘zone.js/dist/long-stack-trace-zone’); }`
vendor.ts
`// Angular
import ‘@angular/platform-browser’;
import ‘@angular/platform-browser-dynamic’;
import ‘@angular/core’;
import ‘@angular/common’;
import ‘@angular/http’;
import ‘@angular/router’;
// RxJS import ‘rxjs’;
// Other vendors for example jQuery, Lodash or Bootstrap // You can import js, ts, css, sass, … import ‘bootstrap-notify’; import ‘bootstrap/dist/js/bootstrap.min.js’; import ‘bootstrap/dist/css/bootstrap.min.css’; import ‘assets/css/dataTable.css’; import ‘assets/css/app.css’; import ‘assets/css/main.css’;`
We seem to be getting an error on production intermittently:
Unhandled Promise rejection: Zone.js has detected that ZoneAwarePromise
(window|global).Promisehas been overwritten. Most likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.) ; Zone: <root> ; Task: Promise.then ; Value: Error: Zone.js has detected that ZoneAwarePromise
(window|global).Promisehas been overwritten. Most likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.) at Function.Zone.assertZonePatched (polyfills.e62b826c4d59b0712100.js:43) at new NgZone (vendor.e62b826c4d59b0712100.js:188) at PlatformRef_._bootstrapModuleFactoryWithZone (vendor.e62b826c4d59b0712100.js:188) at vendor.e62b826c4d59b0712100.js:188 at nrWrapper (newrelic-production.js:4) at ZoneDelegate.invoke (polyfills.e62b826c4d59b0712100.js:43) at Zone.run (polyfills.e62b826c4d59b0712100.js:43) at polyfills.e62b826c4d59b0712100.js:50 at ZoneDelegate.invokeTask (polyfills.e62b826c4d59b0712100.js:43) at Zone.runTask (polyfills.e62b826c4d59b0712100.js:43) Error: Zone.js has detected that ZoneAwarePromise
(window|global).Promise has been overwritten. Most likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.) at Function.Zone.assertZonePatched (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:985) at new NgZone (https://leasing-lms.olacabs.com/vendor.e62b826c4d59b0712100.js:188:5688) at PlatformRef_._bootstrapModuleFactoryWithZone (https://leasing-lms.olacabs.com/vendor.e62b826c4d59b0712100.js:188:10499) at https://leasing-lms.olacabs.com/vendor.e62b826c4d59b0712100.js:188:11358 at nrWrapper (https://leasing-lms.olacabs.com/assets/js/newrelic-production.js:4:14951) at ZoneDelegate.invoke (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:7642) at Zone.run (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:2729) at https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:50:1672 at ZoneDelegate.invokeTask (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:8375) at Zone.runTask (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:3426) n.onUnhandledError @ polyfills.e62b826c4d59b0712100.js:50 handleUnhandledRejection @ polyfills.e62b826c4d59b0712100.js:50 e @ polyfills.e62b826c4d59b0712100.js:50 n.microtaskDrainDone @ polyfills.e62b826c4d59b0712100.js:50 drainMicroTaskQueue @ polyfills.e62b826c4d59b0712100.js:43 Promise resolved (async) scheduleMicroTask @ polyfills.e62b826c4d59b0712100.js:43 ZoneDelegate.scheduleTask @ polyfills.e62b826c4d59b0712100.js:43 Zone.scheduleTask @ polyfills.e62b826c4d59b0712100.js:43 Zone.scheduleMicroTask @ polyfills.e62b826c4d59b0712100.js:43 scheduleResolveOrReject @ polyfills.e62b826c4d59b0712100.js:50 ZoneAwarePromise.then @ polyfills.e62b826c4d59b0712100.js:50 nrWrapper @ newrelic-production.js:4 PlatformRef_._bootstrapModuleWithZone @ vendor.e62b826c4d59b0712100.js:188 PlatformRef_.bootstrapModule @ vendor.e62b826c4d59b0712100.js:188 535 @ app.e62b826c4d59b0712100.js:160 __webpack_require__ @ polyfills.e62b826c4d59b0712100.js:1 window.webpackJsonp @ polyfills.e62b826c4d59b0712100.js:1 (anonymous) @ app.e62b826c4d59b0712100.js:1
I am unable to find which library/code is overwriting the Promise.
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Comments: 43 (14 by maintainers)
Unfortunately it’s not working on my side. The environment that I found the problem is as follow:
both running ng-zone 0.10.3
The issue is present on ie11. I try to include the angular element inside the angular app in the index.html file. if the element loads first I got the error in the object. I tried to include the element with a setTimeout and I don’t get the error but the component (angular element) doesn’t get clicks for example and I have to force using the zone.run()
@Prabin1111 have you got any solution for this error in fusioncharts?
@sdudal, this one will be released very soon, thanks for the waiting.
This issue seems to be resolved updating to Angular
5.2.0
and Zone0.8.20
@dsozzi, this one has been fixed, could you check it in zone.js 0.10.3, thanks.
I had the same problem with old Safari versions. Solved it by adding the versions to the browserslist file:
founde here
Same here, but only in Safari <= 10.1
getting this error on chrome half of the time, running “zone.js”: “0.8.4”