问题
I am using Angular-Cli and I have updated all of my package.json using the ncu tool. Now when I do a npm start (webpack-dev-server --port 4200 --config config/webpack.dev.js --open --progress --profile --watch --content-base src/), webpack hangs at
webpack: wait until bundle finished: /
Is it possible to isolate the package causing the problem? I tried using display-error-details flag but it says it isnt recognized. I dont think it will help even if it is set. There is no error thrown, just asks you to wait indefinitely.
{
"name": "angular2-webpack-starter",
"version": "5.4.1",
"description": "An Angular 2 Webpack Starter kit featuring Angular 2 (Router, Http, Forms, Services, Tests, E2E, Coverage), Karma, Protractor, Jasmine, Istanbul, TypeScript, and Webpack by AngularClass",
"keywords": [
"angular2",
"webpack",
"typescript"
],
"author": "Patrick Stapleton <patrick@angularclass.com>",
"homepage": "https://github.com/angularclass/angular2-webpack-starter",
"license": "MIT",
"scripts": {
"build:aot:prod": "npm run clean:dist && npm run clean:aot && webpack --config config/webpack.prod.js --progress --profile --bail",
"build:aot": "npm run build:aot:prod",
"build:docker": "npm run build:prod && docker build -t angular2-webpack-start:latest .",
"build:local": "npm run clean:dist && webpack --config config/webpack.dev.js --progress --profile",
"build:prod": "npm run clean:dist && webpack --config config/webpack.prod.js --progress --profile --bail",
"appconfigtransform:local": "mustache config/app.config.local.json config/app.config.template.ts > src/app/app.config.ts",
"appconfigtransform:dev": "mustache config/app.config.dev.json config/app.config.template.ts > src/app/app.config.ts",
"appconfigtransform:test": "mustache config/app.config.test.json config/app.config.template.ts > src/app/app.config.ts",
"appconfigtransform:prod": "mustache config/app.config.prod.json config/app.config.template.ts > src/app/app.config.ts",
"build": "npm run build:local",
"ci:aot": "npm run lint && npm run test && npm run build:aot && npm run e2e",
"ci:jit": "npm run lint && npm run test && npm run build:prod && npm run e2e",
"ci:nobuild": "npm run lint && npm test && npm run e2e",
"ci:testall": "npm run lint && npm run test && npm run build:prod && npm run e2e && npm run build:aot && npm run e2e",
"ci:travis": "npm run lint && npm run test && npm run build:aot && npm run e2e:travis",
"ci": "npm run ci:testall",
"clean:dll": "npm run rimraf -- dll",
"clean:aot": "npm run rimraf -- compiled",
"clean:dist": "npm run rimraf -- dist",
"clean:install": "npm set progress=false && npm install",
"clean": "npm cache clean && npm run rimraf -- node_modules doc coverage dist compiled dll",
"docker": "docker",
"docs": "npm run typedoc -- --options typedoc.json --exclude '**/*.spec.ts' ./src/",
"e2e:live": "npm-run-all -p -r server:prod:ci protractor:live",
"e2e:travis": "npm-run-all -p -r server:prod:ci protractor:delay",
"e2e": "npm-run-all -p -r server:prod:ci protractor",
"github-deploy:dev": "webpack --config config/webpack.github-deploy.js --progress --profile --env.githubDev",
"github-deploy:prod": "webpack --config config/webpack.github-deploy.js --progress --profile --env.githubProd",
"github-deploy": "npm run github-deploy:dev",
"lint": "npm run tslint --force \"src/**/*.ts\"",
"postinstall": "npm run webdriver:update",
"postversion": "git push && git push --tags",
"preclean:install": "npm run clean",
"preversion": "npm test",
"protractor": "protractor",
"protractor:delay": "sleep 3 && npm run protractor",
"protractor:live": "protractor --elementExplorer",
"rimraf": "rimraf",
"server:dev:hmr": "npm run server:dev -- --inline --hot",
"server:dev": "webpack-dev-server --port 4200 --config config/webpack.dev.js --open --progress --profile --watch --content-base src/",
"server:prod": "http-server dist -c-1 --cors",
"server:prod:ci": "http-server dist -p 3000 -c-1 --cors",
"server": "npm run server:dev",
"start:hmr": "npm run server:dev:hmr",
"start": "npm run server:dev",
"test": "npm run lint && karma start",
"tslint": "tslint",
"typedoc": "typedoc",
"version": "npm run build",
"watch:dev:hmr": "npm run watch:dev -- --hot",
"watch:dev": "npm run build:dev -- --watch",
"watch:prod": "npm run build:prod -- --watch",
"watch:test": "npm run test -- --auto-watch --no-single-run",
"watch": "npm run watch:dev",
"webdriver-manager": "webdriver-manager",
"webdriver:start": "npm run webdriver-manager start",
"webdriver:update": "webdriver-manager update",
"webpack-dev-server": "webpack-dev-server",
"webpack": "webpack",
"updatestart": "npm run update && npm run server:dev"
},
"dependencies": {
"@angular/animations": "4.3.0",
"@angular/common": "4.3.0",
"@angular/compiler": "4.3.0",
"@angular/core": "4.3.0",
"@angular/forms": "4.3.0",
"@angular/http": "4.3.0",
"@angular/platform-browser": "4.3.0",
"@angular/platform-browser-dynamic": "4.3.0",
"@angular/platform-server": "4.3.0",
"@angular/router": "4.3.0",
"@angularclass/conventions-loader": "1.0.13",
"@angularclass/hmr": "2.1.3",
"@angularclass/hmr-loader": "3.0.3",
"@types/dragula": "^2.1.31",
"angular-sortablejs": "^2.0.6",
"bootstrap-sass": "3.3.7",
"classlist-polyfill": "^1.2.0",
"core-js": "2.4.1",
"font-awesome": "4.7.0",
"font-awesome-sass-loader": "2.0.1",
"http-server": "0.10.0",
"ie-shim": "0.1.0",
"jasmine-core": "2.6.4",
"mustache": "^2.3.0",
"ng2-appinsights": "0.5.0",
"ngx-bootstrap": "1.7.1",
"reflect-metadata": "0.1.10",
"rxjs": "5.4.2",
"sortablejs": "^1.6.0",
"zone.js": "0.8.13"
},
"devDependencies": {
"@angular/compiler-cli": "4.3.0",
"@types/hammerjs": "2.0.34",
"@types/jasmine": "2.5.53",
"@types/node": "8.0.14",
"@types/selenium-webdriver": "~3.0.4",
"@types/source-map": "0.5.0",
"@types/uglify-js": "2.6.29",
"@types/webpack": "3.0.4",
"add-asset-html-webpack-plugin": "2.0.1",
"angular2-template-loader": "0.6.2",
"assets-webpack-plugin": "3.5.1",
"awesome-typescript-loader": "~3.2.1",
"codelyzer": "~3.1.2",
"copy-webpack-plugin": "4.0.1",
"css-loader": "0.28.4",
"css-to-string-loader": "0.1.3",
"exports-loader": "0.6.4",
"expose-loader": "0.7.3",
"extract-text-webpack-plugin": "~3.0.0",
"file-loader": "0.11.2",
"find-root": "1.1.0",
"gh-pages": "1.0.0",
"html-webpack-plugin": "2.29.0",
"imports-loader": "0.7.1",
"istanbul-instrumenter-loader": "2.0.0",
"jasmine-core": "2.6.4",
"json-loader": "0.5.4",
"karma": "1.7.0",
"karma-chrome-launcher": "2.2.0",
"karma-coverage": "1.1.1",
"karma-jasmine": "1.1.0",
"karma-mocha-reporter": "2.2.3",
"karma-remap-coverage": "0.1.4",
"karma-phantomjs-launcher": "^1.0.4",
"karma-sourcemap-loader": "0.3.7",
"karma-webpack": "2.0.4",
"ng-router-loader": "2.1.0",
"ngc-webpack": "2.0.0",
"node-sass": "4.5.3",
"npm-run-all": "4.0.2",
"optimize-js-plugin": "0.0.4",
"parse5": "3.0.2",
"protractor": "5.1.2",
"raw-loader": "0.5.1",
"resolve-url-loader": "2.1.0",
"rimraf": "~2.6.0",
"sass-loader": "6.0.3",
"script-ext-html-webpack-plugin": "1.8.5",
"source-map-loader": "0.2.1",
"string-replace-loader": "1.3.0",
"style-loader": "0.18.2",
"to-string-loader": "1.1.5",
"ts-node": "3.2.0",
"tslib": "1.7.1",
"tslint": "~5.5.0",
"tslint-loader": "3.5.3",
"typedoc": "0.7.1",
"typescript": "~2.4.1",
"url-loader": "0.5.9",
"webpack": "3.3.0",
"webpack-dev-middleware": "1.11.0",
"webpack-dev-server": "2.5.1",
"webpack-dll-bundles-plugin": "1.0.0-beta.5",
"webpack-merge": "~4.1.0"
},
"repository": {
"type": "git",
"url": "https://github.com/angularclass/angular2-webpack-starter.git"
},
"bugs": {
"url": "https://github.com/angularclass/angular2-webpack-starter/issues"
},
"engines": {
"node": ">= 4.2.1",
"npm": ">= 3"
}
}
回答1:
I have similar problem for angular-starter and I was able to remove this bug after:
- upgrade node and npm to lastes versions (still error)
- remove node_modules
npm cache clean --forcenpm install(still error)npm rebuild node-sass --force(still error)- and this is CRITICAL (surprisingly) : build app by
npm run build:aot
After this steps webpack: npm start command start working properly and not hang.
回答2:
For anyone running into this issue I would like to share my findings because the other solutions did not work for me.
We have quite a large application running Angular 5.2.11 and CLI 1.6.8. We also use AOT. In the past we ran into memory issues with NODE during NG SERVE, and as it turns out this issue where NG SERVE freezes during recompile also pops up when NODE is running out of memory.
We were already using a max-old-space-size of 8GB and I have increased this to 12GB. Now my NG SERVE is running without any issues and specifically without the "Wait until bundle finshed" freezes.
We use this command as an alternative to 'ng serve':
node --max-old-space-size=12288 node_modules/@angular/cli/bin/ng serve --aot
Hope this helps anyone.
回答3:
This error also appears if you are not running ng serve command from the correct folder path.
ng serve needs to be launched from the same location where all package.json exists. i.e. /project/
回答4:
If you read on the very top of the output at the console one the files you tried to include doesn't exist at that directory.
回答5:
In my case, there was a syntax error in the closing tag inside HTML <a>Hello<asd a/>
回答6:
if You are Using webpack, please try to remove it from angular-cli.json now you can run your application run automatically. later you can add your webpack to your app.
来源：https://stackoverflow.com/questions/45160506/angular-4-webpack-wait-until-bundle-finished