Angular4 项目，并在使用 command 进行生产构建时看到以下错误：
node --max_old_space_size=8192 'node_modules/@angular/cli/bin/ng' build --prod --output-hashing=al
错误：
vendor.422622daea37e6baf83f.bundle.js 中的错误来自 UglifyJs 意外令牌：名称 (BoxGeometry( [vendor.422622daea37e6baf83f.bundle.js：84218,6]
使用-sm标志运行提供了更多详细信息：
vendor.422622daea37e6baf83f.bundle.js 中的错误来自 UglifyJs 意外令牌：名称 (BoxGeometry(
[MYAPPPATH/node_modules/three/build/three.module.js：12832,0][vendor.422622daea37e6baf83f.bundle.js：84218,6]
three.module.js：12832 行是：
class BoxGeometry extends Geometry {
。然后是一个小类定义。
没有--prod标志的构建就像您想象的那样工作正常，ng serve也是如此。
我相信这可能是由于 ThreeJS 插件 JS 中的 ES6 代码没有被转译到 ES5 造成的，但我不确定如何解决它。 我尝试将"allowJs": true,添加到tsconfig.json，这消除了错误，但是在系绳插件中导致了重复的标识符错误，从我读到的内容来看，这无论如何都不是一个理想的解决方案。
在 tsconfig 中使用 TS 目标版本似乎可以消除错误，但再次导致其他错误。
我在app.module.ts中没有导入语句。 我正在使用以下内容导入包含 ThreeJS 代码的组件：
import * as THREE from 'three';
package.json：
{
"name": "main-app",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "^4.2.4",
"@angular/common": "^4.2.4",
"@angular/compiler": "^4.2.4",
"@angular/core": "^4.2.4",
"@angular/forms": "^4.2.4",
"@angular/http": "^4.2.4",
"@angular/platform-browser": "^4.2.4",
"@angular/platform-browser-dynamic": "^4.2.4",
"@angular/router": "^4.2.4",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.29",
"@ngx-translate/core": "^8.0.0",
"@ngx-translate/http-loader": "^0.1.0",
"@nicky-lenaers/ngx-scroll-to": "^0.6.1",
"@types/three": "^0.103.2",
"angular-moment": "^1.2.0",
"angular2-cookie-law": "^1.4.0",
"angular2-ladda": "^1.2.2",
"angularfire2": "^5.0.0-rc.3",
"aos": "^2.2.0",
"chart.js": "^2.7.2",
"core-js": "^2.4.1",
"firebase": "^4.6.0",
"gsap": "^2.1.3",
"mobile-drag-drop": "^2.3.0-rc.1",
"moment": "^2.19.4",
"ng2-charts": "^1.6.0",
"ng2-dnd": "^4.2.0",
"ng2-img-cropper": "^0.9.0",
"ngx-clipboard": "^9.0.0",
"ngx-quill": "^1.6.0",
"rxjs": "^5.4.2",
"three": "^0.110.0",
"three-dragcontrols": "^0.88.2",
"zone.js": "^0.8.14"
},
"devDependencies": {
"@angular/cli": "1.4.9",
"@angular/compiler-cli": "^4.2.4",
"@angular/language-service": "^4.2.4",
"@types/jasmine": "~2.5.53",
"@types/jasminewd2": "~2.0.2",
"@types/node": "~6.0.60",
"codelyzer": "~3.2.0",
"jasmine-core": "~2.6.2",
"jasmine-spec-reporter": "~4.1.0",
"karma": "~1.7.0",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "^5.4.0",
"ts-node": "~3.2.0",
"tslint": "~5.7.0",
"typescript": "~2.3.3"
}
}
package-lock.json webpack 条目：
"webpack": {
"version": "3.7.1",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-3.7.1.tgz",
"integrity": "sha512-8MR+gVfxsvtx4J1UlbRGkUJEpDQUBFmisRmpPO5cVLgF21R8UMChX39OOjDz63a+m/iswGoqATszdZB2VCsYuA==",
"dev": true,
"requires": {
"acorn": "^5.0.0",
"acorn-dynamic-import": "^2.0.0",
"ajv": "^5.1.5",
"ajv-keywords": "^2.0.0",
"async": "^2.1.2",
"enhanced-resolve": "^3.4.0",
"escope": "^3.6.0",
"interpret": "^1.0.0",
"json-loader": "^0.5.4",
"json5": "^0.5.1",
"loader-runner": "^2.3.0",
"loader-utils": "^1.1.0",
"memory-fs": "~0.4.1",
"mkdirp": "~0.5.0",
"node-libs-browser": "^2.0.0",
"source-map": "^0.5.3",
"supports-color": "^4.2.1",
"tapable": "^0.2.7",
"uglifyjs-webpack-plugin": "^10.4.6",
"watchpack": "^1.4.0",
"webpack-sources": "^1.0.1",
"yargs": "^8.0.2"
}
tsconfig.json：
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
]
}
}
请问我的下一步是什么？
如果它对其他人有帮助，我最终通过删除三个模式模块，从 github 下载 three.js 的预编译版本并在 angular-cli.json 中包含对它的引用来包含它和其他依赖脚本，以便 three.js 工作：
来自angular-cli.json：
...
"scripts": [
...
"assets/libs/three/three.min.js",
"assets/libs/three/GLTFLoader.js",
"assets/libs/three/DragControls.js"
],
...
您还需要将其添加到组件的顶部：
declare const THREE: any; // add an ambient declaration
这现在可以正常工作，但是我已经丢失了所有可爱的三个键入，因此并不理想。