我在做一个有角度的项目。网页在Chrome和Mozilla上显示得很好,但是当涉及到IE11时,页面就锁定在加载页面上了。IE11.0.9600.19100 IE 11上的错误消息我甚至无法追踪到调试错误为空,我有以下配置:
package.json:
"webpack": "^3.12.0",
"webpack-dev-middleware": "^1.6.1",
"webpack-dev-server": "^2.7.1",tsconfig.json:
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"noEmitHelpers": true,
"strictNullChecks": false,
"lib": [
"es2015",
"dom"
],
"typeRoots": [
"node_modules/@types"
],
"types": [
"jasmine",
"node",
"source-map",
"uglify-js",
"webpack"
],
"baseUrl": "./node_modules",
"paths": {
"ng-boosted": ["./src/index"]
}
}polyfills.ts
// Polyfills
/** IE9, IE10 and IE11 requires all of the following polyfills. */
import 'core-js/es5/';
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';
import 'core-js/client/shim';
import 'reflect-metadata';
/** 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';
import 'web-animations-js'; // Run `npm install --save web-animations-js`.
// Typescript emit helpers polyfill
import 'ts-helpers';
require('zone.js/dist/zone');
if ('production' === process.env.ENV) {
// Production
} else {
// Development
Error.stackTraceLimit = Infinity;
require('zone.js/dist/long-stack-trace-zone');
}我在网上看到的一切都没有帮助,我一直在跟踪这些命令角构型。
这是控制台在IE上显示的错误输出。
> eval("/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__ = __webpack_require__(499);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_ssr_window__ = __webpack_require__(288);\n/**\n * Swiper 4.3.5\n * Most modern mobile touch slider and framework with hardware accelerated transitions\n *
> http://www.idangero.us/swiper/\n *\n * Copyright 2014-2018 Vladimir
> Kharlampidi\n *\n * Released under the MIT License\n *\n * Released
> on: July 31, 2018\n */\n\n\n\n\nconst Methods = {\n addClass:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"a\" /* addClass */],\n removeClass: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"b\" /* removeClass */],\n hasClass:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"c\" /* hasClass */],\n toggleClass: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"d\" /* toggleClass */],\n attr:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"e\" /* attr */],\n removeAttr: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"f\" /* removeAttr */],\n data:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"g\" /* data */],\n transform: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"h\" /* transform */],\n transition:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"i\" /* transition */],\n on:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"j\" /* on */],\n off: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"k\" /* off */],\n trigger: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"l\" /* trigger */],\n transitionEnd: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"m\" /* transitionEnd */],\n outerWidth:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"n\" /* outerWidth */],\n outerHeight:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"o\" /* outerHeight */],\n offset:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"p\" /* offset */],\n css: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"q\" /* css */],\n each: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"r\" /* each */],\n html: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"s\" /* html */],\n text: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"t\" /* text */],\n is: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"u\" /* is */],\n index:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"v\" /* index */],\n eq: __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"w\" /* eq */],\n append:
> __WEBPACK_IMPORTED_MODULE_0_dom7_dist_dom7_modular__[\"x\" /* append */],\n prepend:发布于 2018-11-08 09:51:50
我只是更新了Webpack的版本,找到了正确的版本,这是符合我的配置。
"webpack":"3.0.0“、”webpack-dev-中间件“:"^1.6.1”、“webpack server”:"^2.4.1“、”disple-MD5-散列“:"^0.0.5”、“更正-合并”:"^0.17.0“
发布于 2018-09-07 09:43:40
在index.html文件中的<head>部分中添加以下行:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
也可以取消对src/polyfill.ts中所有行的注释
发布于 2018-09-07 15:36:26
有一些多边形需要的应用程序,以能够运行在IE。请查一下这篇文章。
https://blog.angularindepth.com/angular-and-internet-explorer-5e59bb6fb4e9
https://stackoverflow.com/questions/52219347
复制相似问题