javascript - Is there a way to put every configuration file to a config directory rather than root in Node project? - Stack Over

admin管理员组

文章数量:1393889

Lately, I've been creating a chrome extension and for that, I use a bunch of tools and bundlers that requires a config file-usually starting with a dot. In the root directory, everything looks so cluttered, and it takes a few seconds for me to find a file in the root.

-----
|__ src/
|__ static/
|__ .prettierc
|__ .prettierignore
|__ .gitignore
|__ .parcelrc
|__ README.md
|__ manifest.json
|__ popup.html

What I want to do is to put every config file into a directory named config/ as I show here.

-----
|__ src/
|__ static/
|-- config/
|   |__ .prettierc
|   |__ .prettierignore
|   |__ .gitignore
|   |__ .parcelrc
|
|__ README.md
|__ manifest.json
|__ popup.html

How can I achieve this without breaking the normal functionality? Thanks!

I know that some tools lets you define your config file anywhere you want. However, some of them are strict and you can't even rename them. I looked up for the tools I used but I cannot find any information about this issue.

Lately, I've been creating a chrome extension and for that, I use a bunch of tools and bundlers that requires a config file-usually starting with a dot. In the root directory, everything looks so cluttered, and it takes a few seconds for me to find a file in the root.

-----
|__ src/
|__ static/
|__ .prettierc
|__ .prettierignore
|__ .gitignore
|__ .parcelrc
|__ README.md
|__ manifest.json
|__ popup.html

What I want to do is to put every config file into a directory named config/ as I show here.

-----
|__ src/
|__ static/
|-- config/
|   |__ .prettierc
|   |__ .prettierignore
|   |__ .gitignore
|   |__ .parcelrc
|
|__ README.md
|__ manifest.json
|__ popup.html

How can I achieve this without breaking the normal functionality? Thanks!

I know that some tools lets you define your config file anywhere you want. However, some of them are strict and you can't even rename them. I looked up for the tools I used but I cannot find any information about this issue.

• javascript
• node.js
• reactjs
• webpack
• configuration

Share Improve this question Follow asked Mar 31, 2022 at 19:20 Can DurmusCan Durmus 9311 silver badge66 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

1. Use IDE settings to hide config files

I remend that you keep them in their default location since it is a mon conventation to do so. Instead, you can just hide them and this is what I do most of the time to keep my project structure clean.

If you use VS Code, you can add a .vscode/settings.json and hide the files you don't want to see in the explorer tab. You can toggle them back when you need to check or edit any.

.vscode/settings.json file content for your case:

{
  "files.exclude": {
    ".prettierrc": true,
    ".prettierignore": true,
    ".gitignore": true,
    ".parcelrc": true
  }
}

Similarly, if you use JetBrains IDEs, go to File > Settings > Editor > File Types > Ignore files and folders and append the list of files that you want to hide. Your navigator will be much cleaner.

2. Use a VS Code extension to nest files

• Install vscode-file-nesting-config by Anthony Fu in your VS Code IDE.
  
• Add these lines to your settings.json file:

{
  // keep other settings as they are, and add the following at the bottom:
  "explorer.experimental.fileNesting.patterns": {
    "configs": ".gitignore, .prettierrc, .prettierignore, .parcelrc"
  }
}

• Add an empty file named configs in the root of your project.
  Finally, you must have something like this which is probably what you are looking for:

3. Add flags to mands you run to use a different path for config files

If you still want to change their location, this might be helpful for you..

When running prettier mand, add the following flags:

prettier --config [.prettierrc path] --ignore-path [.prettierignore path]

本文标签：