Hide all core/config files of an angular-cli project

I would want to know if i can hide all "core" folders of an angular project, like "e2e" and "node_modules" and files like "package.json" and "tsconfig.json" under some "support_files" folder or something, so i can focus only on the src folder which is where i will be working on.

I have tried playing around with the .angular-cli.json as stated on Changing directory structure in an angular-cli project but either it doesn't find the module 'typescript' from x or the path to x/tsconfig.json doesn't exist (but it does)

I'll leave 2 images to show what you get with a default install with angular-cli and what I'm trying to achieve.

default install structure

the structure I want

Thanks in advance.

Solution

For this you need to change your Workspace setting (or user settings) in your IDE. Mostly we use VS code (visual studio code) for angular development.

In the newer version of VS Code you will find this settings in below path :

File ->Preferences -> Settings

eg.

"files.exclude": {
    "node_modules/": true,
    "e2e/": true
}

similarly, you can hide other core files such as dist, prod etc.

To hide all node_modules in sub folders you can use:

"**/node_modules/**": true