Ionic 2 unmanageble directory structure

Hi all
It seems that the directory structure of an ionic 2 application is “unmanageble” in windows 10 (I guess also in previous version)
I have create a demo ionic 2 application in a directory that is called “E:\Demo” and the result is that some packages have the following directory path:

E:\demo\node_modules\ionic-gulp-sass-build\node_modules\gulp-autoprefixer\node_modules\gulp-util\node_modules\dateformat\node_modules\meow\node_modules\loud-rejection\node_modules\signal-exit\test\fixtures\change-code-expect.json

The previous is 230 characters long, when I tried to delete it the system replied that the filenames are to long and it took more that 5 minutes for the system to delete this directory.

Obviously, the number of characters increases when the initial directory structure is a bit more complicated like d:\work\projects\mobile etc. (instead of D:\demo)

I’m unable to copy the application directory and also I’m unable to compress it (with rar) and copy and decompress it in another folder.

So, any suggestions? Are there any available templates in Visual Studio 2015 that they can solve this issue?
Thanks a lot.

1 Like

Curious, whats your version of node and npm?

Node version is 4.4.3
and npm version 2.15.1

This isn’t really Ionic 2 specific, but a general issue with Node and NPM. I wonder how npm gets around these issues on Windows (or maybe they don’t) as they seem inevitable with deep dependency chains?

Something that does help this is updating to node5x and npm3x.
Since npm3 tries to create a flat dependency tree, I think this kind of nested node_modules will be avoided.

@gnout could you update and give that a try?
You might need to reinstall ionic and cordova

1 Like

I have ran into this problem before. A trick that I have been used that seems to work is to assign a drive letter to folder I.e. the project folder or node. Then you should able to delete or move and such.

Yes, I will. Thank you for the reply.

It seems that the latest version (from node.js site) is 4.4.3 (the one that I have)

The latest is Node6 it seems.

https://nodejs.org/en/

I installed the latest node and npm, started a new ionic 2 app but I got the following error:
**
Installing npm packages…
Error with start undefined
Error Initializing app: There was an error with the spawned command: npminstall
There was an error with the spawned command: npminstall
**
trying to run the ionic serve command, I got the following message:
"Cannot find module ‘process-nextick-args’ "
By the way, it seems that right now the node_modules directory is flat.

I just want to add that there are quite a few breaking changes in Node6.

I installed the ‘process-nextick-args’ package but then I got another error "Cannot find module ionic-gulp-sass-build"
Tried to install it but after installation I got the same error again.

I was struggling with this too. Windows was not able to delete folders containing ionic apps.
Problem is that paths with nested node_modules are too long for windows to handle.

I found some solutions on the net and ended up making this little bat-file for delete folders containing files with too long names.

Use with care :slight_smile:

Usage: delete_long_names FolderName

delete_long_names.bat:

@echo off

echo **
echo ** Folder: %1 
echo **
echo ** USE WITH CARE
choice /C YN /M "Are you sure to delete?"

if %ERRORLEVEL% NEQ 1 (
    goto ABORT
)

echo Deleting %1...

mkdir empty_dir_1234_OO1X_987
robocopy empty_dir_1234_OO1X_987 %1 /s /mir
rmdir empty_dir_1234_OO1X_987
rmdir %1

exit /b

:EMPTY
echo "Missing input (folder name) Folder not found."
exit /b

:ABORT
echo "Aborting..."

Well, my first aim was to try to work with ionic 2!
Long file names is a side effect!

Funny thing is that after the updates that you proposed, I cannot use “ionic serve” because of the errors that I mentioned. Before the updates, at least I was able to run the application with the “ionic serve” command even with the long file names problem!

This is an unfortunate side effect of developing on Windows, they have this arbitrary limit (long ago it wasn’t arbitrary, but now it makes no sense).

Quick and dirty answer, download Cygwin so you can use a Unix shell in Windows. This will also let you delete those paths.

Windows announced in future version it will include a bash shell as to be more attractive to developers, but in the mean time Cygwin works.

Long Path Tool help me a lot when i have an issue like file deleting or renaming the file. Also good to use if file name and file extension is too long.

@gnout It seems that node-sass is not compatible with Node v6 (check out the linked post for details):

Could you run the start command with --verbose so we can see what the output from npm is? Hopefully this will give some insight as to what’s going wrong.

ionic start myapp --v2 --ts --verbose

Thanks!

EDIT: or if you prefer, delete the node_modules directory in your app and run npm install from your project root

1 Like

I’m away for a few days. I will be back mid next week. I will try the solution that you proposed and keep you posted.