Angular-cli: scripts.bundle.js net::ERR_ABORTED

[ylligashi]

Bug Report or Feature Request (mark with an x)

- [x ] bug report -> please search issues before submitting
- [ ] feature request

Versions.

Angular CLI: 1.5.0
Node: 8.8.0
OS: darwin x64
Angular: 5.0.0
... animations, common, compiler, compiler-cli, core, forms
... http, platform-browser, platform-browser-dynamic
... platform-server, router

@angular/cli: 1.5.0
@angular/language-service: 4.4.4
@angular-devkit/build-optimizer: 0.0.32
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.35
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.0
@schematics/angular: 0.1.0
typescript: 2.4.2
webpack: 3.8.1

Repro steps.

When I run 'ng serve --aot` it gives me this error:
GET http://localhost:4200/scripts.bundle.js net::ERR_ABORTED

and because I have included jquery it has problem referencing it.
ERROR ReferenceError: $ is not defined

I checked Network on Dev tools and scripts.bundle.js is NOT FOUND

The log given by the failure.

Desired functionality.

Today I upgraded the project to angular@5 and [email protected] .
Prior to this, it did not happen.

Mention any other details that might be useful.

[Debananda]

same here. I am also facing the same

[ylligashi]

the workaround is NOT using aot just ng serve

[felipefialho]

Same here. I did not use AOT on serve.

[khanhvu161188]

same here with angular 5, cli 1.5

[orjandesmet]

For me, the error only appears in the following situation:
Using ng serve with no flags
The first compilation fails (due to a compile error)
Subsequent build passes (compile error fixed)
==> the scripts.bundle.js file is not generated.

When I abort the ng serve command and restart it, the file is generated as expected.

Node: 6.11.2
Npm: 5.5.1
Typescript: 2.3.4
@angular/cli: 1.5.0 (also occurred in 1.4.9)

[jtoplak]

I get the same issue even when I use ng serve. Just upgraded project from angular 4.3.2 to 5.0.0 and cli 1.5

[JSetti]

I had the same issue. Running npm cache clean seems to have resolved it.

[SelvaNg]

I have the same issue GET http://localhost:4200/scripts.bundle.js net::ERR_ABORTED

[superdioz]

I got the same error updating angular 4 to 5 and cli 1.4.7 to 1.5
I fixed it running:
npm cache verify
I hope that will solve your problem too.

[lvidal1]

Same here.

• angular: 5.0.1
• @angular/cli: 1.5.0,
• typescript: 2.6.1
• npm: 5.5.1
• node: 6.9.5

[dale-dixon]

Double check to see if the path to the script dependency has changed.
This was the problem I ran into...
After updating to the correct path, everything worked.

[SelvaNg]

 Thanks, a typo in .js file created that issue, and after its correction, compiled fine.
Regards, Selva

  From: Dale Dixon <[email protected]>

To: angular/angular-cli [e-mail]
Cc: SelvaNg [e-mail]; Comment [e-mail]
Sent: Wednesday, November 15, 2017 2:32 PM
Subject: Re: [angular/angular-cli] scripts.bundle.js net::ERR_ABORTED (#8371)

Double check to see if the path to the script dependency has changed.
This was the problem I ran into...
After updating to the correct path, everything worked.—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

[eavestn]

Just to increase the number of times this solution appears:

It looks to be an issue with caching. Run:

npm cache clean or npm cache verify.

That has solved it for me.

[qvidmi]

None of
npm cache clean or npm cache verify
doesn't solve the issue for me.

Still have only 5 chunks generated ex:
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry] [rendered]
chunk {main} main.bundle.js (main) 7.73 MB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 1.75 MB [initial] [rendered]
chunk {styles} styles.bundle.js (styles) 1.06 MB [initial] [rendered]
chunk {vendor} vendor.bundle.js (vendor) 13.8 MB [initial] [rendered]

[bastienlemaitre]

Same problem...

[dattapw]

Same problem.

[alamgirqazi]

same issue with "@angular/cli": "1.5.0",

[JesseHeisenberg]

Same problem fixed by update [email protected],but still error with error TS5055 when run ng build --prod and ng build --aot.

[alamgirqazi]

resolved by updating angular cli to "@angular/cli": "1.5.4"

[felipefialho]

Nice, I'll update it...

[iosifpetre18]

I had the same problem, I solved it by updating node to latest version: https://nodejs.org/en/download/
then "npm cache --force clean" and then "npm install"
:)

[ameagol]

This happens when you use Electron and change index.html <base href="/"> to <base href="./">

Just add useHash:true in your route module

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    RouterModule.forRoot(routes, { useHash: true })  // .../#/your-route/
  ]...

[candy4290]

same here:
angular cli:1.5.5
angular:5.0.5
node:9.1.0
typescript:2.6.2
webpack:3.8.1
npm cache clean or npm cache verify don't work for me

[filipesilva]

This seems like a bug but we'll need to look at a reproduction to find and fix the problem. Can you setup a minimal repro please?

You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

[artuska]

Both ng serve --aot and ng build --aot throws hundreds of error TS5055: Cannot write file '/node_modules/zone.js/dist/zone.js' because it would overwrite input file. errors with different files from the /node_modules folder.

Fixed this by removing the "allowJs": true from the tsconfig.json file.

[thessalianpine]

I'm running into the same issue after running a prod build with AOT enabled.
The project is built on Angular5:

Angular CLI: 1.5.0-rc.3
Node: 6.11.1
OS: win32 x64
Angular: 5.0.0
@angular/cli: 1.5.0-rc.3
@angular-devkit/build-optimizer: 0.0.35
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.41
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.0-rc.3
@schematics/angular: 0.0.49
@schematics/schematics: 0.0.10
typescript: 2.4.2
webpack: 3.8.1

Everything worked fine until I tried running the prod build command (testing the CI build step, basically) in my project folder once.

ng build --base-href /baseuri/ --prod --aot true --output-path %CD%/bin_ci

Afterwards the app still builds and runs but displays the error when running it in a browser.

npm cache clean or verify does not fix the problem.

Can't diagnose the problem further curently; deleting the local project, restoring from git and doing a fresh npm install fixes it.

[gpickney]

Same issue. Can't access bundled files when test deploying to AWS with ng serve(shown below), or when accessing index.html from an ng build locally. However, npm start works perfectly locally, and the app runs with no issues.

ng serve --disable-host-check=true --host 0.0.0.0 --base-href /test

node 6.11.0
npm 5.5.1
Windows 10 Pro

"@angular/cdk": "5.0.0",
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
"@angular/core": "^5.0.0",

"@angular/cli": "^1.6.0",
"@angular/compiler-cli": "^5.0.0",
"@angular/language-service": "^5.0.0",

[ravenlark]

I was having the same issue after running ng build. For some reason, my base-href in index.html wasn't being updated to the value specified in my package.json file.

After manually updating it, the errors went away. I ended up just running the full ng build --prod --bh command

[dmacfarlane]

One way script.bundle.js is not generated is if there is a typescript error, but the compile is still successful. I was able to reproduce it this way:

1. ng new repro-app
2. npm install --save jquery
3. Add to .angular-cli.json:
   "scripts": [ "../node_modules/jquery/dist/jquery.min.js" ],
4. Add to AppComponent.ts:
   foo(error) { if (error instanceof Response) { let errMsg = error.error; } }
5. ng serve
6. Complile will error with: webpack: Failed to compile.
7. Add colon to end of line in AppComonent.ts, and re-save the file:
   let errMsg = error.error;;
8. Comile will pass with: webpack: Compiled successfully.
9. Error in the browser: 404 script.bundle.js not found

Using:
Angular CLI: 1.6.0 Node: 6.9.1 OS: win32 x64 Angular: 5.1.0

[richfergus]

Same here.

[miff]

Same error here

[_EDIT_] with ng serve --aot
it's working

Angular CLI: 1.6.0
Node: 8.3.0
OS: darwin x64
Angular: 5.1.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.0
@angular-devkit/build-optimizer: 0.0.35
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.41
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.0
@schematics/angular: 0.1.10
@schematics/schematics: 0.0.10
typescript: 2.4.2
webpack: 3.10.0

[yorickp]

First time trying to build an angular 5 application after having created one with angular 4 (both with angular-cli), and ran into the same issue.

Skipping --aot nor clearing npm cache nor updating node and npm to the latest versions solved my issue.
My conclusion (supported by those noting that ng serve works while ng build doesn't) is that scripts.bundle.js is not needed on an initial build since the latest angular-cli, and thus is not created (as it also is not referenced in index.html in the dist folder after ng build).

The initial error (scripts.bundle.js net::ERR_ABORTED), that led me to this github issue page, occured on our server version where we have an index.html file already in place (wíth a reference to scripts.bundle.js by default as it never threw an issue with angular 4 / older version of angular-cli as that file was always included).
So, removing the reference to scripts.bundle.js in the index.html file eventually solved it for me. (woohoow)

Now I'm only hoping that scripts.bundle.js wíll get created the moment it becomes of any value. :) But for now I got ng build to work on the server, just like ng serve worked locally.

Hope this can help others and that this makes sense to @filipesilva as well.

[prasanthnv]

npm cache verify saves the day :)

[jcuervas]

I was facing the same issue, solved by changing base href="/" to "./" in index.html after build

[sebamed]

If you are uploading this to github pages:
change "/" to "./" in any sheet or script tags in your built index.html and upload it like that

[EmanuelCarneiro]

confirm this was fixed after upgrading the CLI from 1.5.0 to 1.6.7

[clydin]

Closing as resolved with the 1.6.7+. If the issue persists, please open a new issue detailing the problem.

[duyngha]

I used both npm cache verify and npm cache clean and even restart angular cli. Sometime it works, sometimes it doesn't work. It's so weird to me. I still don't know what exactly reason here. Any beyond workarounds for this issue?

[Vaibhav2812]

npm cache verify work for me.

Thanks

[angular-automatic-lock-bot[bot]]

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._}