Ionic-cli: Ionic serve error: Error: ENOENT: no such file or directory, open '/home/.../IonicTest/www/index.html'

[pdrosos]

Hi,

I have just removed the previous version of ionic cli and installed the new one:
npm uninstall -g ionic
npm cache clean
npm install -g ionic

and started a new project:
ionic start IonicTest --v2

The project is generated with the latest ionic-angular 2.0.0-rc.0, but when I go to the project directory and run ionic serve, I see an error in the browser:
Error: ENOENT: no such file or directory, open '/home/pavlina/IonicTest/www/index.html'

CC @jgw96 @danbucholtz @brandyscarney

[flutterwhale]

+1

same problem

[joshuamorony]

Try updating to the current version of Node, not LTS: https://nodejs.org/en/download/current/

I had trouble on 4.x, but with Node v6.7.0 and npm v3.10.3 everything worked fine.

[pdrosos]

@joshuamorony thanks! It works with Node 6.7.0 indeed. I was with 6.5.0 before, which is not the LTS, but there were obviously some issues with it.

[huichogil]

same problem
node5.12.0
npm 3.8.6

[chandandas]

I have done everything mentioned in this forum but still has same issue.

This is very frustrating.

[adirzoari]

save problem

[mmmathur]

I've node 6.6.0, npm 3.10.3 and ionic 2.0.0. I'm getting same error too. I also noticed that there is no gulpfile.js to build the app.
Please help.

Issue, got resolved after updating ionic 2.1.0
Thanks

[adirzoari]

I just wake up this morning with many problems with ionic 2 project. yesterday everything worked project with another project I worked on.
anyone know how to import "LocalStorage"? it shows me error
"LocalStorage is undefined".

[brandyscarney]

A few things need to be checked:

1. CLI version should be 2.1.0 not beta. If you run ionic -v and have anything other than 2.1.0, run:

npm uninstall -g ionic npm install -g ionic

1. NPM version needs to be 3.x, you can check this by running npm -v, if it is not, upgrade your npm version by installing Node 6 or following the instructions here: https://docs.npmjs.com/getting-started/installing-node#updating-npm

We released RC0 with many breaking changes. These have been outlined in the changelog. Please check the changelog and let me know if we need to add clarification to it. We also posted a blog here: http://blog.ionic.io/announcing-the-ionic-2-release-candidate/

@adirzoari Storage has been moved. See the storage section in the changelog.

[adirzoari]

@brandyscarney thank your for you reply.
what about the LocalStorage? how I import it?
I just trying to do
` public local: Storage;
this.local=new Storage(LocalStorage);

;`
and I get error--> LocalStorage is undefined

[adirzoari]

@brandyscarney another thing.
when I try to install npm install @ionic/storage --save --save-exact
I get this error

npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: [email protected]

[danbucholtz]

@adirzoari,

LocalStorage was removed from Ionic as it wasn't a best practice. See the changelog for instructions on how to get up and running with the new @ionic/storage module.

Thanks,
Dan

[ghost]

i cant solve the Eonent issue for 4 days i am about to turn mad :(

[danbucholtz]

@blackkaiken,

Can you provide some more info?

If you run ionic --version, what prints out? If you run npm --version, what prints out?

Can you run npm run build from your project directory and let me know the output?

Thanks,
Dan

[adirzoari]

hello, why I don't have access to global.scss?
I mean when I defined button with primary color it's not change the color to primary color, why is that?
i checked the global page exist.

[danbucholtz]

@adirzoari,

Please create separate issues for your issues.

https://github.com/driftyco/ionic/issues

Thanks,
Dan

[adirzoari]

hey dan, I opened a new issue. just saying that I never get recive to my 4 posts i open.. just when I write into other issues I get recive.. feel confused about that.

[ghost]

@danbucholtz @adirzoari

thank you very much for your responses here is the screen shot. if you help me i ll be honoured

http://imgim.com/image/4108inciy4859929.png

[lucascardoso]

I have the same problem

ionic info:

Can someone help me?

[danbucholtz]

Are you all running npm 3.x?

Can you run npm --version and verify?

Thanks,
Dan

[lucascardoso]

Yes!

Thank you @danbucholtz !

[danbucholtz]

@lucascardoso, Thanks!

Can you run npm run build and give me the entire console output? I don't have enough to work off of right now.

Thanks,
Dan

[lucascardoso]

@danbucholtz, this is the output.

[danbucholtz]

@lucascardoso,

What do your package.json scripts section look like?

To compare, this is how a fresh Ionic app looks when I run that command:

$ npm run build --verbose
npm info it worked if it ends with ok
npm verb cli [ '/usr/local/bin/node',
npm verb cli   '/Users/dan/npm/bin/npm',
npm verb cli   'run',
npm verb cli   'build',
npm verb cli   '--verbose' ]
npm info using [email protected]
npm info using [email protected]
npm verb run-script [ 'prebuild', 'build', 'postbuild' ]
npm info lifecycle ionic-hello-world@~prebuild: ionic-hello-world@
npm info lifecycle ionic-hello-world@~build: ionic-hello-world@

> ionic-hello-world@ build /Users/dan/Dev/myApp2
> ionic-app-scripts build

[11:17:27]  ionic-app-scripts 0.0.29
[11:17:27]  build prod started ...
[11:17:27]  clean started ...
[11:17:27]  clean finished in 11 ms
[11:17:27]  copy started ...
[11:17:27]  ngc started ...
[11:17:27]  lint started ...
[11:17:27]  copy finished in 35 ms
[11:17:27]  lint finished in 365 ms
...

Thanks,
Dan

[danbucholtz]

It looks like you may have installed npm with ignore-scripts.

http://blog.npmjs.org/post/141702881055/package-install-scripts-vulnerability

Thanks,
Dan

[lucascardoso]

@danbucholtz,
apparently this normal for package.json file.
I have this script installed ignore.

Thank you!

[lucascardoso]

@danbucholtz,
It should create the index.html file when running the command ionic serve the first time?

This is the log that appears when running the ionic serve

Thank you!

[danbucholtz]

Your issues are likely do to your setup. Can you run npm run build? That will build everything and get it to a good state. If it doesn't run, the script ignore thing is still not quite right.

Thanks,
Dan

[lucascardoso]

@danbucholtz,
thank you so much! It worked for me! :smile:
I ran the command npm config set ignore-scripts false
and then I ran the command npm run build
and worked as you had shown before

> ionic-hello-world@ build /home/lucas-cardoso/code/ionic/test5
> ionic-app-scripts build

[14:29:05]  ionic-app-scripts 0.0.30
[14:29:05]  build prod started ...
[14:29:05]  clean started ...
[14:29:05]  clean finished in 10 ms
[14:29:05]  copy started ...
[14:29:05]  ngc started ...
[14:29:05]  lint started ...
[14:29:05]  copy finished in 50 ms
[14:29:05]  lint finished in 633 ms
[14:29:20]  ngc finished in 15.59 s
[14:29:20]  bundle prod started ...
[14:29:27]  bundle prod finished in 7.33 s
[14:29:27]  sass started ...
[14:29:29]  sass finished in 1.33 s
[14:29:29]  minify started ...
[14:29:29]  cleancss started ...
[14:29:29]  uglifyjs started ...
[14:29:42]  uglifyjs finished in 12.82 s
[14:29:42]  cleancss finished in 12.82 s
[14:29:42]  minify finished in 12.82 s
[14:29:42]  build prod finished in 37.09 s

[ghost]

@danbucholtz sir these didnt work for me.. could you help me please?

[danbucholtz]

@jthoms1, ^, what do you think of that?

CC: @blackkaiken

Thanks,
Dan

[ghost]

@jthoms1

here is ionic info also... Does anyone help me?

one recycler view on native android with tons of code ... i want ionic with angular 2 :)

note: i got this error after running npm install -g cordova@latest too

[ghost]

"npm ls -g ionic" here is the results..

[kkganesan]

Discard the below. Pages show up after updating "@ionic/app-scripts": "^0.0.34" from 0.0.33
The following post was helpful.
http://blog.ionic.io/ionic-2-rc-weekend-updates/

`

ionic-app-scripts watch

[22:12:26] ionic-app-scripts 0.0.33
[22:12:26] watch started ...
[22:12:26] build dev started ...
[22:12:26] clean started ...
[22:12:26] clean finished in 11 ms
[22:12:26] copy started ...
[22:12:26] transpile started ...
[22:12:26] lint started ...
[22:12:28] lint finished in 1.75 s
[22:12:30] transpile finished in 3.88 s
[22:12:30] bundle started ...
[22:12:30] copy finished in 3.96 s
[22:12:40] bundle finished in 10.36 s
[22:12:40] sass started ...
[22:12:42] sass finished in 2.04 s
[22:12:42] build dev finished in 16.31 s
[22:12:42] watch ready in 16.39 s
Running live reload server: http://localhost:35729
Watching: www//*, !www/lib//_, !www/__/_.map
√ Running dev server: http://localhost:8100
Ionic server commands, enter:
restart or r to restart the client app from the root
goto or g and a url to have the app navigate to the given url
consolelogs or c to enable/disable console log output
serverlogs or s to enable/disable server log output
quit or q to shutdown the server and exit
`

ionic serve -->
In browser Getting Error: ENOENT: no such file or directory, open ..index.html

www contains
assets build index.html manifest.json service-worker.js

ionic -v 2.1.1
node 6.7.0
npm 3.10.3

Let me know if any further details would be helpful

[speedfl]

Solution!!!!!!!!!!!!!!!!!!!!!!!!

"scripts": {
"build": "ionic-app-scripts build",
"watch": "ionic-app-scripts watch",
"serve:before": "watch",
"emulate:before": "build",
"deploy:before": "build",
"build:before": "build",
"run:before": "build"
}

in your package.json

[gopi2mohan]

@speedfl thanks it solved for me. but this is not getting added by default when we create project.

[sklaujb]

Hi, I am still having this problem and is really frustrating.......any can help ?
This is my ionic info

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
ios-deploy version: Not installed
ios-sim version: 5.0.6
OS: Mac OS X El Capitan
Node Version: v7.0.0
Xcode version: Xcode 7.3.1 Build version 7D1014

[speedfl]

@sklaubjb can you show your package.json

[sklaujb]

Hello speedfl, this is the package.json, I tried to change it to what you recommended but is giving me error

{
"name": "ionic-hello-world",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"@angular/common": "2.1.1",
"@angular/compiler": "2.1.1",
"@angular/compiler-cli": "2.1.1",
"@angular/core": "2.1.1",
"@angular/forms": "2.1.1",
"@angular/http": "2.1.1",
"@angular/platform-browser": "2.1.1",
"@angular/platform-browser-dynamic": "2.1.1",
"@angular/platform-server": "2.1.1",
"@ionic/storage": "1.1.6",
"ionic-angular": "2.0.0-rc.3",
"ionic-native": "2.2.3",
"ionicons": "3.0.0",
"rxjs": "5.0.0-beta.12",
"zone.js": "0.6.26"
},
"devDependencies": {
"@ionic/app-scripts": "0.0.45",
"typescript": "2.0.6"
},
"cordovaPlugins": [
"cordova-plugin-device",
"cordova-plugin-console",
"cordova-plugin-whitelist",
"cordova-plugin-splashscreen",
"cordova-plugin-statusbar",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [
"ios",
{
"platform": "ios",
"version": "",
"locator": "ios"
}
],
"description": "NewdotScanner: An Ionic project"
}

[gopi2mohan]

@speedfl i too getting the same issue. my package.json is also same as @sklaujb but if i update my "scripts": {
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},

into this

"scripts": {
"build": "ionic-app-scripts build",
"watch": "ionic-app-scripts watch",
"serve:before": "watch",
"emulate:before": "build",
"deploy:before": "build",
"build:before": "build",
"run:before": "build"
}

everything works fine but why it is not automatically generated by ionic when creating the project

[speedfl]

to be honnest I don't know I am not part of ionic team. I am just a developer like you.

[gopi2mohan]

@speedfl no problem. but after doing some research i found this blog http://blog.ionic.io/improvements-to-ionic-build-process/ everything looks ok but not able to see the gulp file run before lite-server runs.

[danbucholtz]

It seems like the build is failing and note reporting the outcome correctly.

Can you update the following packages so we can troubleshoot this better?

npm install -g ionic@latest
npm install @ionic/app-scripts@latest

Can you also append a --debug to the npm script for ionic:serve so we can see additional logging? That may provide a hint.

Thanks,
Da

[gopi2mohan]

@danbucholtz I got the out put i am using ubuntu16.04, So i forgot to use sudo command.

Now it is working fine thanks

[sklaujb]

I am doing everything I can get from here but is still facing the same issue. I am also having build error when trying to build for android. This is what I get

_

cache taskArtifacts.bin (/Volumes/My Passport/ionic/hello/platforms/android/.gradle/2.13/taskArtifacts/taskArtifacts.bin) is corrupt. Discarding.
_

_

FAILURE: Build failed with an exception.

• What went wrong:
  Could not open cache taskArtifacts.bin (/Volumes/My Passport/ionic/hello/platforms/android/.gradle/2.13/taskArtifacts/taskArtifacts.bin).

  Corrupted FreeListBlock 0 found in cache '/Volumes/My Passport/ionic/hello/platforms/android/.gradle/2.13/taskArtifacts/taskArtifacts.bin'.

• Try:

Run with --stacktrace option to get the stack trace. Run with
--info or --debug option to get more log output.

BUILD FAILED

_

Are this 2 issues related? I am really at a lost of what to do next.............any advice pls.........

[sklaujb]

No one ??...........

[kevendra]

please try
$ npm install ionic@latest -g
$ npm install @ionic/app-scripts@latest --save-dev
$ npm run ionic:build
$ npm run ionic:serve

[gigetto03]

i also have the same problem, i have tried to send the above commands, i attach the screen of error received (screen is referred to "npm install @ionic/app-scripts@latest")

[paul-landaeta-tierconnect-com]

I solved with npm run ionic:build

[ShiroTeky]

Thanks @danbucholtz After one week of frustration. You save my day. Merry Xmas

[Elrashid]

solved by running
npm run build
Before
ionic serve

[amity203]

I am getting this error, despite of trying all possible steps shown here, writing here after frustrated 2 hours:
Runtime Error
Module build failed: Error: ENOENT: no such file or directory, open '/Users/Documents/IonicMaster/src/pages/menuthree/menuthree.js' at Error (native)
Stack
Error: Module build failed: Error: ENOENT: no such file or directory, open '/Users/Documents/IonicMaster/src/pages/menuthree/menuthree.js'
at Error (native)
at Object. (http://localhost:8100/build/main.js:97312:7)
at __webpack_require__ (http://localhost:8100/build/main.js:20:30)
at Object. (http://localhost:8100/build/main.js:56476:79)
at __webpack_require__ (http://localhost:8100/build/main.js:20:30)
at Object. (http://localhost:8100/build/main.js:97232:82)
at __webpack_require__ (http://localhost:8100/build/main.js:20:30)
at Object. (http://localhost:8100/build/main.js:85905:73)
at __webpack_require__ (http://localhost:8100/build/main.js:20:30)
at Object. (http://localhost:8100/build/main.js:105203:70)
at __webpack_require__ (http://localhost:8100/build/main.js:20:30)
Ionic Framework: 2.0.0-rc.5
Ionic Native: 2.2.11
Ionic App Scripts: 1.0.0
Angular Core: 2.2.1
Angular Compiler CLI: 2.2.1
Node: 6.9.4
OS Platform: macOS Sierra
Navigator Platform: MacIntel
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.95 Safari/537.36

Anyone know of any other solution, other then what is mentioned here.

[amity203]

Why it is looking for a .JS file instead of a .TS file

[Endtry]

$ npm install ionic@latest -g
$ npm install @ionic/app-scripts@latest --save-dev

the two commands above also fixes the live reload issue.

[chpecson]

I do run the build first and then execute ionice serve. And it works fine for me.
And these are the commands:
npm run build
ionic serve

[gacalves]

npm run build in project folder solved for me.

npm -v
3.10.10
$ cordova -v
6.5.0
$ ionic -v
2.2.1
$ node -v
v6.10.0

[MorisNotari]

In my case the problem was caused by the fact that my project was in a subfolder of a NTSF junction on Windows.

E.g.: c:/works/my.ionic.project

Where works is a NTFS junction to a directory on the same drive.

npm run build cannot find all necessary files but doesn't report any error to the user.

Don't know if this is a NPM issue or a Ionic CLI issue, maybe @danbucholtz (or others Ionic team members) could figure it out...

[yhalwani]

EDIT: For some reason when I served from Node.js Cmd Prompt it worked, but from Git Bash it did not

I have had similar errors
"Runtime Error
Module build failed: Error: ENOENT: no such file or directory, open 'C:UsersYoussefDocumentsApp DevIonicIonic CLISamplestab-sampletabApp3srcappmain.js' at Error (native)"

My ionic info

Cordova CLI: 6.5.0
Ionic Framework Version: 3.0.1
Ionic CLI Version: 2.2.2
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.3.3
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 8.1
Node Version: v6.10.2
Xcode version: Not installed

I have tried running

npm install -g ionic@latest
npm install @ionic/app-scripts@latest
npm run ionic:build
npm run ionic:serve --debug

Here is the debug output that I think is causing the issue

Basically the wepack loader is failing to load main.js
Any help is appreciated!

@jgw96 @danbucholtz @brandyscarney

[sjosen]

@amity203 I had the same issue until I realised I was importing a component with a small typo

import {User} from "../models/user"

instead of

import {User} from "../models/User"

It was first when running ionic run android --device --prod I was presented with an error. The app worked without issues in the serve environment

[SanjayYadav90]

Actually we are missing index.html file here-
www/index.html
just copy and paste index file to resolve this issue-
copy form src/index.html
paste here www/index.html

hopefully that will for for you as this worked for me.
also can see here on stack OverFlow
https://stackoverflow.com/questions/40669878/error-enoent-no-such-file-or-directory-open-in-ionic2

[prasad456]

Hi having while creating a project

my installed versions are
node 8.6.0
nodejs 8.6.0
npm 5.3.0

what should I do?

[Nigrito]

Hi, I am still having this problem and is really VERY frustrating.......any can help ?

my ionic info
`
cli packages: (C:UsersmonakoAppDataRoamingnpmnode_modules)

@ionic/cli-utils  : 1.13.1
ionic (Ionic CLI) : 3.13.2

global packages:

cordova (Cordova CLI) : 7.1.0

local packages:

@ionic/app-scripts : 3.0.0
Cordova Platforms  : android 6.3.0
Ionic Framework    : ionic-angular 3.7.1

System:

Android SDK Tools : 25.2.5
Node              : v8.7.0
npm               : 2.15.12
OS                : Windows 10

Misc:

backend : pro`

[seanbrice]

If it helps anyone, in my case the error similar to that mentioned was caused by having the following in a block commented ( as in inside.. /* */ ) section of code. The comment was in a Provider, and had nothing to do with the boiler plate setup.. it was just being parked towards the base of my script as reference for something I was working on.

@Component({

selector: 'page-home',
templateUrl: 'home.html'
})

I narrowed it down to removing this chunk of code causing the issue to disappear, even though there was a still a lot of other code left in the block comment.

There was no use of any build command between removing and putting it back, seeing the error disappear, then appear again when the code was present.. just running

ionic serve --platform="ios"

So, worthwhile checking to see if you have anything lingering around in your comments that is magically being plucked out and processed during serve or build. If there's a reason why the above is meant to happen, i.e. the block comment is seemingly ignored, I'd be interested to know.