Ionic-cli: ionic serve/build is not building main.js nor outputting any errors

[jgw96]

_From @ajmesa9891 on December 6, 2016 0:43_

Ionic version: (check one with "x")
[ ] 1.x
[x] 2.x

I'm submitting a ... (check one with "x")
[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:

When working on a project running ionic serve runs into the issue below in the browser

http://localhost:8100/build/main.js Failed to load resource: the server responded with a status of 404 (Not Found)

And I do not see any errors in the logs terminal.

When running ionic build

[19:41:14]  uglifyjs failed: ENOENT: no such file or directory, open
            '/Users/alejandrom/cajitas-cooks-app/www/build/main.js'
[19:41:14]  ionic-app-script task: "build"
[19:41:14]  Error: ENOENT: no such file or directory, open '/Users/alejandrom/cajitas-cooks-app/www/build/main.js'

I also ran ionic-app-scripts transpile; it finishes without outputting any errors in the terminal

Expected behavior:

I would expect for the site to be served and the app to be built. Or to see errors explaining why the build failed.

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.14
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: 1.9.0
ios-sim version: 5.0.9
OS: OS X El Capitan
Node Version: v6.7.0
Xcode version: Xcode 8.1 Build version 8B62

_Copied from original issue: driftyco/ionic#9505_

[jgw96]

_From @ajmesa9891 on December 6, 2016 14:27_

I was able to get over this. I went back to a commit that worked and slowly added commits back while I had ionic serve running. When I added the troublesome commit I saw the error in the terminal/browser. At this point, if I shut down ionic serve and attempted to ionic serve again and the described behavior in the report above would happen (no errors would come up, just that it could not build main.js).

Since, through the method described above, I knew what the error was I went ahead and fixed it. This fixed the issues I had with ionic serve and ionic build.

I think there's a bug somewhere there; in this case it did not show the specific error of why main.js was unable to build. I don't think the information I have provided is enough to debug this issue so I will close it. Hopefully this is helpful to someone out there.

[jgw96]

_From @lucas-entronic on December 7, 2016 18:35_

I had the same issue. At no point did I see any error message or warning, other than main.js not building. It did eventually come down to a bug in my code: I had an index.ts file that exported a path that didn't exist. Some kind of appropriate error message would have been greatly appreciated!

Here's my ionic info, for reference:

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.45
ios-deploy version: 1.9.0
ios-sim version: 5.0.12
OS: OS X El Capitan
Node Version: v7.1.0
Xcode version: Xcode 8.1 Build version 8B62

[jgw96]

_From @ajmesa9891 on December 8, 2016 21:42_

I'm going to reopen the issue; I think someone should take a look since other people are going to keep experiencing this behavior.

[jgw96]

_From @ajmesa9891 on December 12, 2016 14:7_

Can easily reproduce this now. Run ionic build android while ionic serve is running on a different terminal. The version you are serving to the browser often has the described main.js error. Restarting ionic serve fixes the issue.

[goleary]

I was having the exact same problem. I upgraded to the latest version of ionic (2.0.0-rc.4) and it fixed it for me:
https://github.com/driftyco/ionic/blob/master/CHANGELOG.md

Don't forget to follow the instructions on the breaking changes in ionic-app-scripts

[lightoze]

I have a similar problem with RC.4 after I've copied a project and did some code changes.

Edit: I eventually found out the cause - one index.ts file had an export from one of the files I've deleted. Surprisingly, no errors were given at any point.

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.4
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.47
OS: Linux 4.8
Node Version: v6.9.2

[akaztp]

Having the same problem. Compilation does not notice any problem, but main.js is not produced.
For me the prolem was in:
export * from './abc';
on an index.ts file, pointing to a just deleted file.

Ionic Framework: 2.0.1
Ionic Native: 2.2.11
Ionic App Scripts: 0.0.47
Angular Core: 2.2.1
Angular Compiler CLI: 2.2.1
Node: 6.8.1
OS Platform: Windows 10
Navigator Platform: Win32

[kinglionsoft]

Having the same problem. Compilation does not notice any problem, but main.js is not produced.
As @akaztp said, the problem was caused by EXPORT FROM WRONG PATH。

[shyamal890]

+1 Facing the same issue

[SaravananArunagiri]

myself also having the same problem. Finally, solution found in git issues
npm uninstall -g cordova ionic
then
npm install -g cordova ionic

Its worked for me.

[AlGantori]

In my case somehow an extra COMMA crept in at the end of package.json

"dependencies": {
    "@angular/common": "4.1.0",
    "@angular/compiler": "4.1.0",
    "@angular/compiler-cli": "4.1.0",
    "@angular/core": "4.1.0",
    "@angular/forms": "4.1.0",
    "@angular/http": "4.1.0",
    "@angular/platform-browser": "4.1.0",
    "@angular/platform-browser-dynamic": "4.1.0",
    "@ionic-native/core": "3.6.1",
    "@ionic-native/splash-screen": "3.6.1",
    "@ionic-native/status-bar": "3.6.1",
    "@ionic/storage": "2.0.1",
    "ionic-angular": "3.2.0",
    "ionicons": "3.0.0",
    "rxjs": "5.1.1",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.10"
  },
  "devDependencies": {
    "@ionic/app-scripts": "1.3.7",
    "@ionic/cli-plugin-cordova": "1.0.0",
    "@ionic/cli-plugin-ionic-angular": "1.0.0",
    "typescript": "^2.3.2"
  },
  "description": "An Ionic project",

}
Real languages should never use separators only terminators.  :)  Yep even in  arrays :)

[abervoet]

Just in case some people still land here with this type of error, I found out that you can identify import errors from barrels (index.ts) during transpile by removing declare module '*'; from src/declarations.d.ts.

See the declarations.d.ts file comments for explanations about what this wildcard module is about.

The following error do not output when declare module '*'; is present, which leads to the main.js not being built, and the app displaying nothing, with a 404 on www/build/main.js.

In this case, the import path export * from './facebook-credentials'; was incorrect or the file did not exist.

C:\work\[myApp]> ionic serve
[INFO] Starting app-scripts server: --address 0.0.0.0 --port 8100 --livereload-port 35729 -
       Ctrl+C to cancel
[21:08:50]  watch started ...
[21:08:50]  build dev started ...
[21:08:50]  clean started ...
[21:08:50]  clean finished in 19 ms
[21:08:50]  copy started ...
[21:08:50]  transpile started ...
[21:09:02]  typescript: C:/work/[myApp]/src/models/auth/index.ts, line: 2
Cannot find module './facebook-credentials'.
       L1:  export * from './base-credential';
       L2:  export * from './facebook-credentials';
       L3:  export * from './login-credentials';

You obviously need to restore declare module '*'; in src/declarations.d.ts in case your app use third party libs that do not have definition files (cases when you need to declare things like declare var xxxxx: any; on top of class). I don't know if this is mandatory regarding the ionic or angular framework.

This error happens often when you refactor/clean your code too hard at once

[PriceFallin]

@abervoet Do you know of an Ionic3 method for what you mentioned in your post? Seems those files no longer exist in Ionic3.

I happen to be getting the same issue with the ionic serve command doing nothing other than creating the local web server and showing the index.html file. I've checked a lot of the paths in my code because that seems to be the most common issue but didn't find anything out of the ordinary.

[nickwinger]

i have the problem that ionic serve does only show Typescript errors on first build.
After that when the watch triggers, it does not show any errors no more but just says "Build finished".
Completely stupid and unusable...

[tehnorm]

Also seeing this issue when typescript has an error. A way to reproduce:

1. import something that doesn't exist
2. ionic serve
3. save a file to trigger a rebuild

Notice something along the lines of this in the output:

[17:52:49]  transpile update started ...
[17:52:49]  transpile update finished in 29 ms

Output does not contain any of the initial typescript errors. Hrmmm.... Bothersome.

Go modify https://github.com/ionic-team/ionic-app-scripts/blob/master/src/transpile.ts#L179 to always return false.

1. restart ionic serve
2. save a file to trigger a rebuild

Notice the typescript failure in the rebuild output:

[18:10:16]  transpile started ...
[18:10:16]  typescript: src/pages/home/home.ts, line: 4
            File '/Users/norm/src/models/device.ts' is not a module.

       L3:  import { ConnectedDevicesProvider } from '../../providers/connected-devices/connected-devices';
       L4:  import { DeviceModel } from '../../models/device';

It seems like some logic is incorrect in transpile.ts canRunTranspileUpdate() and masking typescript errors on a update vs a build. Looking like this issue is very much real.

[ionitron-bot[bot]]

Thanks for the issue! This issue appears to be associated with an old version of the Ionic CLI. Please update to the latest CLI version, which supports all versions of the Ionic Framework. If the issue is relevant and if it persists after updating to the latest CLI version, please create a new issue.

Thank you for using Ionic!