Ionic 2 Not Generating app.bundle.js

Hello -

When I run ionic serve or gulp build, my /www/build/ directory is being generated, along with several sub-directories. The /www/build/js directory is being generated and contains several files, but the app.bundle.js file is not there. When the app tries to run in my browser, I get a white screen and a 404 Error in my console.

Any ideas would be greatly appreciated.

1 Like

This may help:

5 Likes

Thank you, that worked!

We had "ionic-gulp-browserify-typescript": "^1.1.0", , I changed to "ionic-gulp-browserify-typescript": "1.1.0", (removed the caret) and ran npm install. Then things started working.

5 Likes

Thanks, this worked for me too. Anyone know why this happened and how we can prevent it happening again?

Hmm, Iā€™m not seeing this with 1.1.1 installed of the browserify plugin. Testing against a clean install and new project, everything is building fine for me.

Are you getting any errors in your terminal when you build?

I think this only becomes a problem when adding additional third party libraries.

If I create a blank Ionic 2 project and run Ionic serve everything is as expected.

However, if I run npm install lodash --save then typings install lodash and run ionic serve, I get a Typescript compiler error saying cannot find module lodash. This then stops any app.bundle.js file from being generated.

I donā€™t think this was a problem before I updated my ionic-cli to the latest version

Cordova CLI: 6.1.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.9
Ionic CLI Version: 2.0.0-beta.32
Ionic App Lib Version: 2.0.0-beta.18
ios-deploy version: 1.8.6
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v4.2.4
Xcode version: Xcode 7.3 Build version 7D175

Just posted a comment on another forum post about this too:

1 Like

This solved my problem!

It probably only happen if there is error. I have this error and just ignore it was fine before. But this might become issue now

[16:59:03] Finished ā€˜sassā€™ after 2.28 s
TypeScript error: C:/ionic/mapleapp-bak/app/providers/connectivity/connectivity.ts(23,37): Error TS2339: Property ā€˜connectionā€™ does not exist on type ā€˜Navigatorā€™.
TypeScript error: C:/ionic/mapleapp-bak/app/providers/connectivity/connectivity.ts(25,36): Error TS2339: Property ā€˜connectionā€™ does not exist on type ā€˜Navigatorā€™.
TypeScript error: C:/ionic/mapleapp-bak/app/providers/connectivity/connectivity.ts(36,35): Error TS2339: Property ā€˜connectionā€™ does not exist on type ā€˜Navigatorā€™.
TypeScript error: C:/ionic/mapleapp-bak/app/providers/connectivity/connectivity.ts(38,36): Error TS2339: Property ā€˜connectionā€™ does not exist on type ā€˜Navigatorā€™.
11.6 MB bytes written (8.00 seconds)

I am still having issues with this, as @mbrookson said i noticed this when installing/uninstalling plugins. i started a brand new project and slowly started moving code across including latest angular fire and it started to work but a few saves later Iā€™m getting errors out of angularfire so i back tracked through steps that once worked that now no longer do.

Updated browserify to 2.0.0,
typings install,
I ripped out angularfire2 from my app completely
and it STILL wont build app.bundle.js

Have you checked that your typings is set up correctly? The newer version uses ā€œglobalDependenciesā€ rather than ā€œambientDependenciesā€ now, and also the file ā€˜main.d.tsā€™ has been renamed to ā€˜index.d.tsā€™

Fixed here?

This worked for me as well!
Had the same issue and even tried removing the ā€œ^ā€. The trick was to re-run npm install AFTER removing the caret.

Same here, removing the caret in package.json & running npm install did the job.

I have version 2.0.0 and also have error below, so to which version I need to lower it down to ?
Error TS2339: Property 'data' does not exist on type

> npm list ionic-gulp-browserify-typescript
my_project@ my/project/dir/
ā””ā”€ā”€ ionic-gulp-browserify-typescript@2.0.0

That appears to be an error in your code. You are referencing a ā€œdataā€ property that is undeclared.

This seems due to newly-added enforcement of TypeScript correctness in ionic-gulp-browserify-typescript 2.0.

By removing the caret as described above, it will use 1.1.1 specifically. With the caret, it will use the newest version >= 1.1.1, which is now 2.0 and fails to build on TS errors. Removing the caret is really not a long-term solution, but allows it to work for now. I faced this too; among other things I think it happens whenever one attempts to dereference generically-declared objects with dot notation. In that case it can be avoided by declaring them to be of type any or being sure to dereference with bracket notation

/**
var t = {};
Object.assign(t, tOrig);
delete t.prop; // TS Error, BUILD FAILS SILENTLY !!! */

var t:any = {}; // *note 'any' type
Object.assign(t, tOrig);
delete t.prop; // OK

When using generic objects as dictionaries (idiomatic JavaScript), one must dereference with bracket syntax (good JS practice anyway, IMO). Dot syntax will throw TypeScript errors, despite being valid JavaScript.

Iā€™m somewhat new to TypeScript, but I donā€™t really like how this is failing silently. If itā€™s going to fail, there should at least be a message, e.g. ā€œBuild failed due to TypeScript error(s).ā€

1 Like

Wonder if maybe there is a way to configure this behaviour of failing due to TS errors?

here is the change - there is an option only for fail on warnings

Iā€™ve copy-paste it from here :slight_smile:


I thought it was -that- simple ā€¦ :confused:

Itā€™s my first project in V2, can you explain how to declare this variable ?

what variable? Note that this thread is regarding app.bundle.js being not generated. Now we know that the reason is failing due to TS compilation errors after upgrading ionic-gulp-browserify-typescript.

If there is any problem with the migration documetation this is either a bug or something to be possibly clarified. In either case youā€™ll have better chance finding an answer by looking for appropriate migration related thread or creating a new one :wink:

Hi I am facing same issue for ionic-gulp-browserify-typescriptv2.0.0.0

1 Like