angular / angular-cli

CLI tool for Angular
https://cli.angular.io
MIT License
26.76k stars 11.98k forks source link

Halting Problem at 95%. Shows emitting as the action doing. #9980

Closed tibinthomas closed 6 years ago

tibinthomas commented 6 years ago

I was hit by a problem like halting problem of truing machine while using the angular cli as follows. My script : node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng build -e=prod --prod --sourcemap --vendor-chunk=true --build-optimizer

Versions

Angular CLI: 1.7.3
Node: 9.8.0
OS: win32 x64
Angular: 5.2.8
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router

@angular/cli: 1.7.3
@angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2
@angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.2
@schematics/angular: 0.3.2
@schematics/package-update: 0.3.2
typescript: 2.4.0
webpack-bundle-analyzer: 2.11.1

Repro steps

Use this script : node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng build -e=prod --prod --sourcemap --vendor-chunk=true --build-optimizer --stats-json

Observed behavior

The program is running indefinitely.

Desired behavior

The program should halt to say if there is some error in the script.

coryrylan commented 6 years ago

Running into this as well on CLI 1.7.3 (Windows 10 x64, node 9.x). Prior version seem to work (cli 1.6.8). I think this may be related https://github.com/webpack/webpack/issues/2908

masysma commented 6 years ago

I am experiencing this too with 1.7.3 on Windows 10. Build finishes normally if I remove --sourcemaps from parameters.

awerlang commented 6 years ago

Duplicate of #6795 (sourcemap problem on 1.7.x)

PS: Actually the original issue was possibly another thing, but last month of comments refer to the same thing as this one.

elvisbegovic commented 6 years ago

same here in 6rc6 infite : 95% emitting index-html-webpack-plugin with this config:

 "optimization": true,
              "outputHashing": "none",
              "sourceMap": true,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": true,
              "buildOptimizer": true

same problem if I set buildOptimizer to false!

ps: it working when set optimization to false 95% step if finish in 1 second

(version : nodejs10, npm6, win64, angular6rc5, cli6rc6)

cc @clydin

raulalexe commented 6 years ago

Same issue here with Cli 6.0.0, I can only build if one of sourceMap or optimization is set to false.

citygent commented 6 years ago

Samesies on moving from 1.7.4 to 6 to get more control over sourcemaps etc. for CD. Windows 10.

sluglit commented 6 years ago

Same as #10591

robport commented 6 years ago

+1

crunchyintheory commented 6 years ago

+1, also having this problem when sourceMap is set to true

genna commented 6 years ago

I have the same issue when sourceMap = true on @angular/cli 6.0.3 It started to appear after @angular/cli 1.6.8 on Windows 10

On Mac it works great

robport commented 6 years ago

Please note, I get this problem on my PC, but not on my Macbook. A colleague has also seen this problem on a PC laptop. So it seems Windows specific,

AwsmOli commented 6 years ago

having it on mac too now

cp-michal commented 6 years ago

Same issue. This is not first time when you get information about problem and it meet's with zero reaction from your side.

troygould commented 6 years ago

Building on Windows 10 or 2012 R2.

I do see the 95% hanging issue if I have "optimization": true, "outputHashing": "all", "sourceMap": true, "extractCss": true, "namedChunks": false, "aot": true, "extractLicenses": true, "vendorChunk": true, "buildOptimizer": true

If I change optimization to false, it doesn't hang. Can anyone point me to something that even explains what optimization does? I know buildOptimizer is used for tree shaking, but unsure what optimization does.

ArsalRaza commented 6 years ago

Getting, same issue... Any work around?

HarelM commented 6 years ago

I have the same problem with my project. Win 10, 64 bit, I've seen this starting since 1.7.x. It is still happening with latest angular-cli (6.0.5).

GustavoAmerico commented 6 years ago

+1

robport commented 6 years ago

Disappointing that something that prevents cli working in production is seemingly ignored. Am I missing something?

Juliete commented 6 years ago

+1

jgoodrow commented 6 years ago

Our prod build runs as long as we're not using maps, so while it's not a breaking issue it is a serious qol issue. +1

GustavoAmerico commented 6 years ago

I find out that the problem happens when I try to build with parameter - - output-path

I'm avoiding the problem by running NG config set output-path before build

Juliete commented 6 years ago

The output path also can be configured in the build options in the angular.json file

GustavoAmerico commented 6 years ago

The problem with configuring the output directory in the angular.json file is that the computer running the build is dynamic, in some builds the output directory is x:[variable folder2]\artifact in others it is D:[variable folder1]\artifact

I solved by running this sequence:

  1. ng config projects.myProject.architect.build.configurations[$environment]["outputPath"] $environmentOutput
  2. ng build --prod --c $environment
TylerHelmuth commented 6 years ago

Our prod builds are also failing with sourceMaps, but setting the outputPath field in the angular.json file didn't work. So, using angular-cli 6.0.8,

"production": {
    "optimization": true,
    "outputHashing": "all",
    "sourceMap": true,
    "extractCss": true,
    "namedChunks": false,
    "aot": true,
    "extractLicenses": true,
    "vendorChunk": false,
    "buildOptimizer": true,
    "fileReplacements": [
        {
            "replace": "src/environments/environment.ts",
            "with": "src/environments/environment.prod.ts"
        }
    ],
    "outputPath": "dist/"
}

does not work but

"production": {
    "optimization": true,
    "outputHashing": "all",
    "sourceMap": false,
    "extractCss": true,
    "namedChunks": false,
    "aot": true,
    "extractLicenses": true,
    "vendorChunk": false,
    "buildOptimizer": true,
    "fileReplacements": [
        {
            "replace": "src/environments/environment.ts",
            "with": "src/environments/environment.prod.ts"
        }
    ],
    "outputPath": "dist/"
}

does work.

Jonesie commented 6 years ago

+1

lucasBertola commented 6 years ago

+1

jgoodrow commented 6 years ago

Unfortunately our build fails to complete with or without base-href

awerlang commented 6 years ago

Why it hangs at 95%?

On webpack Compiler.js, method emitAssets(), a badly formed directory name is passed (the drive letter included twice) to mkdirp. It hangs because of [0]. It looks like it's an issue only on Windows.

What makes it hang?

Indeed the source maps for the styleUrls. Unlike the js files, these css files are referenced by the full path. I guess previously they weren't generated. I'm not sure exactly what to make of those, but extracting a relative path might help. I'm curious how is the output on non-Windows platforms.

// need to call this on mkdirp and writeFile
const relativePath = makePathsRelative(this.context, targetFile);

I'd say it's okay to not generate .css.map for production builds. I don't think they are useful.

@filipesilva how to proceed with this fix? This is a show stopper for v6.x for Windows users.

Refs: [0] https://github.com/substack/node-mkdirp/pull/125

filipesilva commented 6 years ago

Does anyone have a simple repro I can look at for this issue?

@awerlang you seem to have a very good idea of the problem. I think I know the general situation where a badly formatted directory name can be passed inside the CLI setup. If you can put together a simple repro that exhibits this behaviour maybe I can track it down.

awerlang commented 6 years ago

@filipesilva Thanks for answering. This can be easily reproduced on Windows using quickstart: https://angular.io/generated/zips/cli-quickstart/cli-quickstart.zip

  1. Unzip, then on a shell:
  2. npm i
  3. ng build --prod --source-map
filipesilva commented 6 years ago

@awerlang I couldn't reproduce using a project I had around, but could reproduce following your steps.

I was able to track down the precise flags to ng build --aot --optimization --source-map. It happens on the latest stable version and also on rc.1 (@angular-devkit/build-angular@0.7.0-rc.1 and @angular/cli@6.1.0-rc.1).

Following your hint of looking inside the node_modules/lib/Compiler.js and the emitFiles function (line 255), logging targetFile didn't show me a badly formatted path but did show a absolute path:

$ ng build --aot --optimization --source-map --progress=false
D:\sandbox\cli-quickstart\src\app\app.component.css.map
runtime.js
vendor.js
styles.js
polyfills.js
main.js
runtime.js.map
vendor.js.map
styles.js.map
polyfills.js.map
main.js.map
favicon.ico
3rdpartylicenses.txt
index.html

Between projects that built, and projects that did not built, the difference seemed to be that absolute path.

Investigating further, it seems like this problem happens only for component css, when our internal CleanCssWebpackPlugin is used with sourcemap support, and only on some installs. It doesn't happen on a brand new project, but seems to happen on a updated project.

I haven't been able to track down which dependency is it that causes this. Comparing the dependency trees between a new project and a project that exhibits the bug didn't show anything relevant... except maybe that in a bugged project I saw postcss-import@11.1.0 using resolve@1.8.1, and in a non-bugged project it was using resolve@1.1.7.

I pushed up a repro that exhibits this behaviour at https://github.com/filipesilva/angular-cli-9980. I used node 8.11.0 and npm 6.1.0 to install the dependencies.

Still looking further into this problem.

hahn-kev commented 6 years ago

I have a project that started out using CSS and I switched to SCSS after a while. I've been having the halting problem. After reading your summary I checked to see if I have any CSS files still in use. After converting all my CSS files to SCSS the build started working again with source maps on.

So I can confirm that the issue is directly related to CSS files.

filipesilva commented 6 years ago

Turns out the reason my initial repro did not work was because the component CSS needed to have some content, not only exist.

So having some basic CSS on src/app/app.component.css like:

h1 {
  background-color: #000;
}

On a starter project and running ng build --aot --optimization --source-map will always reproduce the problem.

Changing that to a .scss file like @hahn-kev mentioned will make the bug go away.

So now we know that it's definitely related to CSS files specifically and content is needed to reproduce.

awerlang commented 6 years ago

@filipesilva

Following your hint of looking inside the node_modules/lib/Compiler.js and the emitFiles function (line 255), logging targetFile didn't show me a badly formatted path but did show a absolute path:

Up to that point, targetFile points to an absolute path. Which may or may the not the cause, IDK. The badly format path it's the one passed to mkdirp and writeFile, after joining with the output path. I transformed the absolute path into a relative one, then it emitted the .css.map files with the directory structure under outputPath. Then the second build would fail because cleaning outputPath didn't remove all the previously emitted files/directories. I guess the directories are needed otherwise filenames would clash if flatenned.

roldengarm commented 6 years ago

Why is this issue closed? On Angular/CLI 6.1.1 the issue still occurs when I have optimization enabled @hansl ?

awerlang commented 6 years ago

@roldengarm I haven't tried on my project at work yet, but I pointed out earlier the issue could be reproduced with v6.0.8 on the quickstart itself. The problem went away with the latest version.

I suggest openning your own issue with a repro.

vaduveerappan commented 6 years ago

I am able to reproduce the same with 6.2.1

icesmith commented 6 years ago

In my case, the problem was solved by updating devkit package ng update @angular-devkit/build-angular

vaduveerappan commented 6 years ago

With @icesmith suggestion of upgrading @angular-devkit/build-angular to 0.8.1 , I am able to enable source-maps on production build

cadamsdev commented 5 years ago

still happens in version 7 stuck on 95% emitting CopyPlugin

mattmeye commented 5 years ago

still happens in version 7 stuck on 95% index-html-webpack-plugin

sidhommoez commented 5 years ago

any solution for 95% emitting CopyPlugin (version 7)

kyrrr commented 5 years ago

Happens when using --watch with --poll ${time} and/or with --output-path, but not with --watch by itself. --watch not watching seems to be a Vagrant/Windows issue, but that's beside the point. Pain!

JoeWHoward commented 5 years ago

Not sure if this will help anyone else, but for me (Windows 10) the node_modules folder was getting installed in the wrong place, I moved it a directory down and it solved the problem.

MoeinMP commented 5 years ago

any solution for "ng build --prod 95% emitting index-html-webpack-plugin" (Angular version 7) when set "sourceMap": true in angular.json ?

Zordaxy commented 5 years ago

+1 Still need any workaround for elder versions of Angular cli. In my case it is 1.7.3

angular-automatic-lock-bot[bot] commented 5 years ago

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.