@cherepanov.pavel/shareable-config 1.0.0 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +221 -8
- package/package.json +53 -44
package/README.md
CHANGED
|
@@ -1,10 +1,223 @@
|
|
|
1
|
-
#
|
|
2
|
-
The goal of this project is to provide easy creation of new repositories with code linting settings(and not only) that I like.
|
|
3
|
-
I will be glad if it is useful to someone else.
|
|
1
|
+
# Frontend Configs
|
|
4
2
|
|
|
5
|
-
|
|
6
|
-
### Windows
|
|
3
|
+
👉 **If you want to integrate these configs into Quasar, be sure to read the [Quasar integration specifics](#quasar-integration-notes) section below!**
|
|
7
4
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
5
|
+
**This repository is intended to standardize and centralize formatting and linting across all of my projects.**
|
|
6
|
+
You can always override any rules to suit a specific project's needs.
|
|
7
|
+
|
|
8
|
+
---
|
|
9
|
+
|
|
10
|
+
## Quick Start
|
|
11
|
+
|
|
12
|
+
**IMPORTANT!**
|
|
13
|
+
Before installing this package, remove `eslint`, `stylelint`, `@stylistic/*`, `@typescript-eslint/*` and any other linting/formatting-related packages from your project.
|
|
14
|
+
The correct versions of those dependencies will be installed automatically when you install this package.
|
|
15
|
+
|
|
16
|
+
**IMPORTANT!**
|
|
17
|
+
As you'll see further down in this README, the project is flexible and supports overrides at every level.
|
|
18
|
+
|
|
19
|
+
1. **Open the target project.**
|
|
20
|
+
2. **Install the package:**
|
|
21
|
+
```sh
|
|
22
|
+
npm i @cherepanov.pavel/shareable-config
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
3. **Copy the config files:**
|
|
26
|
+
- `eslint.config.js`
|
|
27
|
+
- `stylelint.config.js`
|
|
28
|
+
|
|
29
|
+
For now, simply copy these files from this repository into your project. Please copy them as-is
|
|
30
|
+
and use the override functions. They may be generated by the package in future versions.
|
|
31
|
+
It's important that your changes aren't overwritten later.
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
4. **Update imports:**
|
|
36
|
+
|
|
37
|
+
Before:
|
|
38
|
+
```js
|
|
39
|
+
import {
|
|
40
|
+
globalConfig,
|
|
41
|
+
jsConfig,
|
|
42
|
+
tsConfig,
|
|
43
|
+
vueConfig,
|
|
44
|
+
} from './tools/eslint-config/index.js';
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
After:
|
|
48
|
+
```js
|
|
49
|
+
import {
|
|
50
|
+
globalConfig,
|
|
51
|
+
jsConfig,
|
|
52
|
+
tsConfig,
|
|
53
|
+
vueConfig,
|
|
54
|
+
} from '@frontend/configs/tools/eslint-config/index.js';
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
5. **Override rules via the `override` function in your own configs where needed.**
|
|
58
|
+
|
|
59
|
+
---
|
|
60
|
+
|
|
61
|
+
## Working with configuration files
|
|
62
|
+
|
|
63
|
+
### Generated files
|
|
64
|
+
|
|
65
|
+
- `.editorconfig`
|
|
66
|
+
- `.gitattributes`
|
|
67
|
+
- `.gitignore`
|
|
68
|
+
- `extensions.json`
|
|
69
|
+
- `settings.json`
|
|
70
|
+
|
|
71
|
+
After installing the package, run:
|
|
72
|
+
```sh
|
|
73
|
+
npx -p "@frontend/configs" set-env
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
Then run:
|
|
77
|
+
```sh
|
|
78
|
+
npx -p "@frontend/configs" get-all
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
or run any other command if you want to update partially.
|
|
82
|
+
> See the full list of commands in the `bin` section of `package.json`.
|
|
83
|
+
|
|
84
|
+
---
|
|
85
|
+
|
|
86
|
+
### How to make your changes and keep receiving updates
|
|
87
|
+
|
|
88
|
+
#### For non-JSON files (`.editorconfig`, `.gitattributes`, `.gitignore`)
|
|
89
|
+
|
|
90
|
+
1. Append the comment `# override` at the end of the file.
|
|
91
|
+
2. After that, add your project-specific rules.
|
|
92
|
+
|
|
93
|
+
Example:
|
|
94
|
+
```ini
|
|
95
|
+
# ...base rules...
|
|
96
|
+
|
|
97
|
+
# override
|
|
98
|
+
# Your project-specific rules
|
|
99
|
+
```
|
|
100
|
+
> During package updates, only the content above `# override` will be changed.
|
|
101
|
+
|
|
102
|
+
---
|
|
103
|
+
|
|
104
|
+
#### For JSON files
|
|
105
|
+
|
|
106
|
+
##### Overriding keys
|
|
107
|
+
|
|
108
|
+
Add the comment `// override` at the end of the object and include new or changed keys.
|
|
109
|
+
|
|
110
|
+
Before:
|
|
111
|
+
```json
|
|
112
|
+
{
|
|
113
|
+
"recommendations": [
|
|
114
|
+
"eamodio.gitlens",
|
|
115
|
+
"vue.volar"
|
|
116
|
+
]
|
|
117
|
+
}
|
|
118
|
+
```
|
|
119
|
+
|
|
120
|
+
After:
|
|
121
|
+
```json
|
|
122
|
+
{
|
|
123
|
+
"recommendations": [
|
|
124
|
+
"eamodio.gitlens",
|
|
125
|
+
"vue.volar"
|
|
126
|
+
],
|
|
127
|
+
// override
|
|
128
|
+
"recommendations": [],
|
|
129
|
+
"my-recommendations": [
|
|
130
|
+
"some-content"
|
|
131
|
+
]
|
|
132
|
+
}
|
|
133
|
+
```
|
|
134
|
+
|
|
135
|
+
##### Adding and removing array items
|
|
136
|
+
|
|
137
|
+
Add the comment `// override` at the end of the array. Commented-out lines within the override block will be removed from the final array.
|
|
138
|
+
|
|
139
|
+
Before:
|
|
140
|
+
```json
|
|
141
|
+
{
|
|
142
|
+
"recommendations": [
|
|
143
|
+
"eamodio.gitlens",
|
|
144
|
+
"vue.volar"
|
|
145
|
+
]
|
|
146
|
+
}
|
|
147
|
+
```
|
|
148
|
+
|
|
149
|
+
After:
|
|
150
|
+
```json
|
|
151
|
+
{
|
|
152
|
+
"recommendations": [
|
|
153
|
+
"eamodio.gitlens",
|
|
154
|
+
"vue.volar",
|
|
155
|
+
// override
|
|
156
|
+
"redhat.vscode-yaml"
|
|
157
|
+
//"vue.volar"
|
|
158
|
+
]
|
|
159
|
+
}
|
|
160
|
+
```
|
|
161
|
+
- `"redhat.vscode-yaml"` will be added.
|
|
162
|
+
- `"vue.volar"` will be removed from the final array.
|
|
163
|
+
|
|
164
|
+
> This works for nested objects and arrays as well!
|
|
165
|
+
|
|
166
|
+
---
|
|
167
|
+
|
|
168
|
+
## Summary
|
|
169
|
+
|
|
170
|
+
Use this repository as a single source for configs.
|
|
171
|
+
Only override what you need using the override mechanism.
|
|
172
|
+
Receive updates without losing your custom changes.
|
|
173
|
+
|
|
174
|
+
---
|
|
175
|
+
|
|
176
|
+
## Quasar integration notes
|
|
177
|
+
|
|
178
|
+
> When applying these configs to Quasar projects you may encounter a few additional issues. Below are recommendations for correct integration:
|
|
179
|
+
|
|
180
|
+
### 1. eslint version compatibility
|
|
181
|
+
|
|
182
|
+
Quasar (`@quasar/app-vite`) declares a peer dependency:
|
|
183
|
+
|
|
184
|
+
```
|
|
185
|
+
peer eslint@"^6.0.0 || ^7.0.0 || >=8.0.0"
|
|
186
|
+
```
|
|
187
|
+
|
|
188
|
+
but these configs require `eslint@9.x`.
|
|
189
|
+
|
|
190
|
+
Solution:
|
|
191
|
+
|
|
192
|
+
- Create a `.npmrc` file in the project root if it doesn't already exist.
|
|
193
|
+
- Add this line:
|
|
194
|
+
```
|
|
195
|
+
legacy-peer-deps=true
|
|
196
|
+
```
|
|
197
|
+
- Then run:
|
|
198
|
+
```sh
|
|
199
|
+
npm install eslint@9.30.0 -D
|
|
200
|
+
```
|
|
201
|
+
- This pins the required eslint version in your project.
|
|
202
|
+
|
|
203
|
+
### 2. Correct component import casing
|
|
204
|
+
|
|
205
|
+
By default, Quasar auto-imports components in kebab-case, while our linting configs require PascalCase.
|
|
206
|
+
|
|
207
|
+
Solution:
|
|
208
|
+
|
|
209
|
+
- In `quasar.config.js` set the option:
|
|
210
|
+
```js
|
|
211
|
+
autoImportComponentCase: 'pascal', // or 'combined'
|
|
212
|
+
```
|
|
213
|
+
- More info: [Quasar: autoImportComponentCase](https://quasar.dev/quasar-cli-vite/quasar-config-file/#framework)
|
|
214
|
+
|
|
215
|
+
### 3. Config file formats
|
|
216
|
+
|
|
217
|
+
Quasar projects typically don't have `type: "module"` in `package.json` by default, so to make configs work correctly:
|
|
218
|
+
|
|
219
|
+
- Rename the config files:
|
|
220
|
+
- `stylelint.config.js` → `stylelint.config.mjs`
|
|
221
|
+
- `eslint.config.js` → `eslint.config.mjs`
|
|
222
|
+
|
|
223
|
+
or use the `.mts` extension for TypeScript-based configs.
|
package/package.json
CHANGED
|
@@ -1,54 +1,63 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cherepanov.pavel/shareable-config",
|
|
3
3
|
"description": "setup for new repositories",
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.2",
|
|
5
5
|
"type": "module",
|
|
6
|
-
"
|
|
6
|
+
"devEngines": {
|
|
7
|
+
"packageManager": {
|
|
8
|
+
"name": "npm",
|
|
9
|
+
"version": "12.0.2"
|
|
10
|
+
},
|
|
11
|
+
"runtime": {
|
|
12
|
+
"name": "node",
|
|
13
|
+
"version": "26.7.0"
|
|
14
|
+
}
|
|
15
|
+
},
|
|
7
16
|
"repository": {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
17
|
+
"type": "git",
|
|
18
|
+
"url": "https://github.com/Cherepanov-Pavel/shareable-config"
|
|
19
|
+
},
|
|
11
20
|
"files": [
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
21
|
+
"env.json5",
|
|
22
|
+
"env.json5.set.js",
|
|
23
|
+
".editorconfig",
|
|
24
|
+
".editorconfig-get.js",
|
|
25
|
+
".gitattributes",
|
|
26
|
+
".gitattributes-get.js",
|
|
27
|
+
".gitignore",
|
|
28
|
+
".gitignore-get.js",
|
|
29
|
+
".vscode/",
|
|
30
|
+
"tools/",
|
|
31
|
+
"utils/",
|
|
32
|
+
"jsconfig.json"
|
|
33
|
+
],
|
|
34
|
+
"bin": {
|
|
35
|
+
"set-env": "./env.json5.set.js",
|
|
36
|
+
"get-all": "./.get-all.js",
|
|
37
|
+
"get-editorconfig": "./.editorconfig-get.js",
|
|
38
|
+
"get-gitattributes": "./.gitattributes-get.js",
|
|
39
|
+
"get-gitignore": "./.gitignore-get.js",
|
|
40
|
+
"get-extensions": "./.vscode/extensions.json-get.js",
|
|
41
|
+
"get-settings": "./.vscode/settings.json-get.js",
|
|
42
|
+
"get-code-snippets": "./.vscode/.code-snippets-get.js"
|
|
43
|
+
},
|
|
35
44
|
"dependencies": {
|
|
36
|
-
"@eslint/compat": "
|
|
37
|
-
"@stylistic/eslint-plugin": "
|
|
38
|
-
"@stylistic/stylelint-plugin": "
|
|
39
|
-
"@typescript-eslint/eslint-plugin": "^8.
|
|
40
|
-
"@typescript-eslint/parser": "^8.
|
|
41
|
-
"eslint": "^10.
|
|
42
|
-
"eslint-plugin-vue": "^10.
|
|
43
|
-
"fs-extra": "^11.
|
|
44
|
-
"jiti": "^2.
|
|
45
|
+
"@eslint/compat": "2.1.0",
|
|
46
|
+
"@stylistic/eslint-plugin": "5.10.0",
|
|
47
|
+
"@stylistic/stylelint-plugin": "5.2.1",
|
|
48
|
+
"@typescript-eslint/eslint-plugin": "^8.66.0",
|
|
49
|
+
"@typescript-eslint/parser": "^8.66.0",
|
|
50
|
+
"eslint": "^10.8.1",
|
|
51
|
+
"eslint-plugin-vue": "^10.10.0",
|
|
52
|
+
"fs-extra": "^11.4.0",
|
|
53
|
+
"jiti": "^2.7.0",
|
|
45
54
|
"json5": "^2.2.3",
|
|
46
|
-
"postcss-html": "^
|
|
47
|
-
"stylelint": "^
|
|
48
|
-
"stylelint-config-standard": "^
|
|
49
|
-
"stylelint-config-standard-scss": "^
|
|
50
|
-
"stylelint-config-standard-vue": "^
|
|
51
|
-
"stylelint-order": "^
|
|
52
|
-
"vue-eslint-parser": "^10.4.
|
|
55
|
+
"postcss-html": "^2.0.0",
|
|
56
|
+
"stylelint": "^17.14.1",
|
|
57
|
+
"stylelint-config-standard": "^40.0.0",
|
|
58
|
+
"stylelint-config-standard-scss": "^17.0.0",
|
|
59
|
+
"stylelint-config-standard-vue": "^2.0.0",
|
|
60
|
+
"stylelint-order": "^8.1.1",
|
|
61
|
+
"vue-eslint-parser": "^10.4.1"
|
|
53
62
|
}
|
|
54
63
|
}
|