Выполнение поиска в StackOverflow и Google просто приводит к множеству результатов, которые либо кажутся либо крайне устаревшими в современном темпе JS, либо терпят неудачу во время сборки, либо приводят к тому, что VSCode или IntelliJ lint выбрасывают; что не моя проблема:
Таким образом, я сделал эту тему.
Фон
Приложение - это приложение, которое я принял в качестве собственного разработчика для обслуживания неопределенное количество времени назад, с оригинальными разработчиками, которые больше не доступны.
Теперь мне было поручено обновить его; но для этого мне нужно было исправить возникшую проблему с зависимостями, которая приводила к тому, что любая из новых сборок с теми же коммитами, которые раньше работали, не работала.
Таким образом, я перешел к первому обновлению узла, npm и всех задействованных пакетов; так что я могу создать хороший базовый уровень, чтобы попытаться обеспечить соответствие будущим для быстрых обновлений и опираться на них.
Тем не менее, я подхожу к тому, что мне кажется, что начинать с нуля было бы лучшим вариантом, но это сдерживается моим чувством, что это очень близко для разрешения, и так Повторить было бы очень неэффективным использованием моего времени, так как у меня есть куча вещей, которые можно делать и с другими вещами.
Согласно истории фиксации приложения, это было изначально приложение Angular2, и оно было обновлено до Angular 5 до того, как я вступил во владение. Эта версия работала нормально и в настоящее время работает в док-контейнере; если не восстановлен, что приводит к сбою некоторых очень важных функций (особенно взаимодействия) на целевых устройствах. Это значит, что я не могу обновить, пока не выкопаю, что именно там находится дерево зависимостей, или просто продолжу и решу проблему, продвигаясь вперед.
В последнее время я выполняю обновление с Angular 5.0 до Angular 6.1, используя указания, указанные в https://update.angular.io/, которые, по крайней мере, на компьютере разработчика и эмуляторе целевого устройства, работали нормально.
В качестве преамбулы, она имеет некоторые ионные элементы, но кажется, что она предназначена только для стилей и значков и не используется в полной мере, поскольку все команды, используемые как в DockerFile, так и в Readme, используют angular-cli. вместо этого.
Так что некоторые детали приложения
package.json
{
"name": "",
"author": "",
"private": true,
"description": "",
"scripts": {
"start": "ng serve",
"build": "ng build",
"build:prod": "node_modules/.bin/ng build --prod --aot=true",
"start:dev": "ng serve --port 8100 --host=0.0.0.0 --disable-host-check", "server:prod": "node_modules/.bin/http-server dist --cors --silent "
},
"dependencies": {
"@angular/core": "~6.1.5",
"@angular/compiler": "~6.1.5",
"@angular/common": "~6.1.5",
"@angular/http": "~6.1.5",
"@angular/forms": "~6.1.5",
"@angular/platform-browser": "~6.1.5",
"@angular/platform-browser-dynamic": "~6.1.5",
"@angular/router": "~6.1.5",
"@ng-idle/core": "~6.0.0-beta.3",
"@ngx-translate/core": "~9.1.1",
"@ngx-translate/http-loader": "~2.0.1",
"@reactivex/rxjs": "~6.3.2",
"http-server": "~0.11.1",
"angular2-uuid": "~1.1.1",
"ajv": "~6.5.3",
"caniuse-db": "~1.0.30000884",
"core-js": "~2.5.7",
"ionic-angular": "~3.9.2",
"ionicons": "4.4.3",
"lodash": "~4.17.5",
"moment": "~2.22.2",
"node-sass": "~4.9.3",
"rxjs": "~6.3.2",
"rxjs-compat": "^6.3.2",
"zone.js": "~0.8.26"
},
"devDependencies": {
"@types/node": "8.0.53",
"@angular/cli": "~6.1.5",
"@angular/compiler-cli": "~6.1.5",
"@angular-devkit/build-angular": "~0.7.5",
"@angular-devkit/core": "~0.7.5",
"@types/lodash": "~4.14.112",
"codelyzer": "~4.4.4",
"ts-node": "~7.0.1",
"tslint": "~5.11.0",
"typescript": "2.9.2"
}
}
tsconfig.app.json
{
"compilerOptions": {
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"types": [],
"lib": [
"es2017",
"dom"
]
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}
Требуется наличие ES5, поскольку целевые устройства не могут работать с более новыми версиями, а методология JIT будет медленной на компьютере.
Что работает?
ng serve
Работает нормально, страница полностью работоспособна и работает как положено. Тесты также успешны.
Сборка и запуск сборки через
ng build --prod --aot=true
http-server dist --cors --silent
Также завершает сборку без ошибок.
Простой http-сервер загружается и успешно размещает файлы.
Выпуск
Однако , когда я открываю браузер и перехожу на страницу, я получаю следующую ошибку.
Uncaught Error: Cannot find module '@angular/core'
at n (VM736 main.84a8ed63029b59b371ad.js:1)
at VM736 main.84a8ed63029b59b371ad.js:1
at VM736 main.84a8ed63029b59b371ad.js:1
at Object.eD2c (VM736 main.84a8ed63029b59b371ad.js:1)
at p (VM734 runtime.a66f828dca56eeb90e02.js:1)
at Object.zUnb (VM736 main.84a8ed63029b59b371ad.js:1)
at p (VM734 runtime.a66f828dca56eeb90e02.js:1)
at Object.4 (VM736 main.84a8ed63029b59b371ad.js:1)
at p (VM734 runtime.a66f828dca56eeb90e02.js:1)
at n (VM734 runtime.a66f828dca56eeb90e02.js:1)
Это единственная ошибка, и angular-app отказывается от рендеринга в браузере.
Это происходит как на компьютере разработчика, так и в док-контейнере, в который в конечном итоге встроено приложение, поэтому среда сборки должна быть исключена как переменная.
Я уверен, что это должно быть проблемой tsconfig или чем-то подобным, или что-то, чего просто не хватает моей неопытности с ts или angular.