Internet Explorer 11,ECMAScript 对象属性分配问题
Posted
技术标签:
【中文标题】Internet Explorer 11,ECMAScript 对象属性分配问题【英文标题】:Internet Explorer 11, ECMAScript Object property assignment problem 【发布时间】:2019-05-13 13:28:26 【问题描述】:在我的 Angular7 应用程序中,我进行了一些更改(angular7 升级和包依赖项升级等),我注意到我的应用程序无法在 PROD Internet Explorer 11 上正常运行。我在本地主机上工作时没有任何问题,但是在我将我的应用程序发布到 PROD 后,它给了我以下错误:
SCRIPT1003: Expected ':'
main-client.js (559,109)
我调查了 main-client.js,我发现了这个:
Pr="ɵdefineBase":defineBase,
"ɵdefineComponent":defineComponent,
"ɵdefineDirective":H,
defineInjectable, ## This is line:559 and column:109 ##
defineInjectable 需要是"defineInjectable": defineInjectable
。我已经通过以下示例在 IE11 开发人员工具中对此进行了测试,
c = 3; d=4; values = a:1, b:2, c, d output is: Expected ':'
但这正是 IE11 想要的:
c = 3; d=4; values = a:1, b:2, c:c, d:d outpus is: OK
PS:我正在使用 webpack 构建应用程序。问题可能与 ECMAScript 版本或 Webpack 有关,但我无法指出。如果有人想要我的 webpack.config 文件,我也可以添加它。 这是我的 tsconfig 文件:
tsconfig.json
"compilerOptions":
"moduleResolution": "node",
"module": "es2015",
"target": "es5",
"alwaysStrict": true,
"noImplicitAny": false,
"sourceMap": true,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"skipDefaultLibCheck": true,
"skipLibCheck": true,
"allowUnreachableCode": false,
"lib": [
"es2016",
"dom"
],
"types": [ "node" ]
,
"include": [
"ClientApp"
]
tsconfig.app.json
"extends": "../tsconfig.json",
"compilerOptions":
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"sourceMap": true,
"types": ["node"]
,
"exclude": [
"test.ts",
"**/*.spec.ts"
]
tsconfig.spec.json
"extends": "../tsconfig.json",
"compilerOptions":
"outDir": "../out-tsc/spec",
"module": "commonjs",
"target": "es5",
"baseUrl": "",
"types": ["jasmine", "node"]
,
"files": ["polyfills.ts"],
"include": ["**/*.spec.ts", "**/*.d.ts"]
【问题讨论】:
是的,很明显它是用对象解构编译的,也就是 es6。我可能会建议将target: es5
添加到您的tsconfig.app.json
中......另外,更新Webpack。否则,它要么是你的 webpack 配置本身的问题,要么是你应该作为问题发布到 Webpack 存储库的东西。
【参考方案1】:
我已经通过编辑 webpack.config.js 和 webpack.config.vendor.js TerserPlugin(UglifyJsPlugin 的替代品)解决了这个问题,请注意插件选项在两个文件(webpack.config.js 和 webpack.config.供应商.js)。所有这些都需要编辑。
在 webpack.config.js 和 webpack.config.vendor.js
中 new TerserPlugin( //or UglifyJsPlugin
cache: true,
parallel: true,
terserOptions:
compress: false,
ecma: 6, //Setting this to "ecma: 5" solved problem.
mangle: true,
keep_classnames: true,
keep_fnames: true
,
sourceMap: true
)
这就是我找到解决方案的地方,
https://github.com/MarkPieszak/aspnetcore-angular-universal/issues/706 https://github.com/MarkPieszak/aspnetcore-angular-universal/issues/666 https://ariya.io/2013/03/es6-and-method-definitions我希望它会有所帮助。
【讨论】:
以上是关于Internet Explorer 11,ECMAScript 对象属性分配问题的主要内容,如果未能解决你的问题,请参考以下文章