Skip to content

Commit ff3e8c2

Browse files
authored
feat: allowComponentTypeUnsafety option to configure the strictness of no-unsafe-* rules (#185)
1 parent 49dffb1 commit ff3e8c2

37 files changed

+2936
-250
lines changed

README.md

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ import {
6262
configureVueProject,
6363
} from '@vue/eslint-config-typescript'
6464

65+
// Optional: configure the Vue project to adjust the strictness of the rulesets or speed up linting.
6566
configureVueProject({
6667
// Whether to parse TypeScript syntax in Vue templates.
6768
// Defaults to `true`.
@@ -70,7 +71,7 @@ configureVueProject({
7071
// Also, type-aware rules won't be applied to expressions in templates in that case.
7172
tsSyntaxInTemplates: true,
7273

73-
// Optional: specify the script langs in `.vue` files
74+
// Specify the script langs in `.vue` files
7475
// Defaults to `['ts']`.
7576
scriptLangs: [
7677
'ts',
@@ -93,8 +94,18 @@ configureVueProject({
9394
'jsx',
9495
],
9596

96-
// <https://github.com/vuejs/eslint-plugin-vue/issues/1910#issuecomment-1819993961>
97-
// Optional: the root directory to resolve the `.vue` files, defaults to `process.cwd()`.
97+
// Whether to override some `no-unsafe-*` rules to avoid false positives on Vue component operations.
98+
// Defaults to `true`.
99+
// Usually you should keep this enabled,
100+
// but if you're using a metaframework or in a TSX-only project
101+
// where you're certain you won't operate on `.vue` components in a way that violates the rules,
102+
// and you want the strictest rules (e.g. when extending from `strictTypeChecked`),
103+
// you can set this to `false` to ensure the strictest rules apply to all files.
104+
allowComponentTypeUnsafety: true,
105+
106+
// The root directory to resolve the `.vue` files.
107+
// Defaults to `process.cwd()`.
108+
// More info: <https://github.com/vuejs/eslint-plugin-vue/issues/1910#issuecomment-1819993961>
98109
// You may need to set this to the root directory of your project if you have a monorepo.
99110
// This is useful when you allow any other languages than `ts` in `.vue` files.
100111
// Our config helper would resolve and parse all the `.vue` files under `rootDir`,

examples/quasar-project/.editorconfig

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
[*.{js,jsx,mjs,cjs,ts,tsx,mts,cts,vue}]
2+
charset = utf-8
3+
indent_size = 2
4+
indent_style = space
5+
end_of_line = lf
6+
insert_final_newline = true
7+
trim_trailing_whitespace = true

examples/quasar-project/.gitignore

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
.DS_Store
2+
.thumbs.db
3+
node_modules
4+
5+
# Quasar core related directories
6+
.quasar
7+
/dist
8+
/quasar.config.*.temporary.compiled*
9+
10+
# Cordova related directories and files
11+
/src-cordova/node_modules
12+
/src-cordova/platforms
13+
/src-cordova/plugins
14+
/src-cordova/www
15+
16+
# Capacitor related directories and files
17+
/src-capacitor/www
18+
/src-capacitor/node_modules
19+
20+
# Log files
21+
npm-debug.log*
22+
yarn-debug.log*
23+
yarn-error.log*
24+
25+
# Editor directories and files
26+
.idea
27+
*.suo
28+
*.ntvs*
29+
*.njsproj
30+
*.sln
31+
32+
# local .env files
33+
.env.local*

examples/quasar-project/.npmrc

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
# pnpm-related options
2+
shamefully-hoist=true
3+
strict-peer-dependencies=false
4+
# to get the latest compatible packages when creating the project https://github.com/pnpm/pnpm/issues/6463
5+
resolution-mode=highest
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"$schema": "https://json.schemastore.org/prettierrc",
3+
"singleQuote": true,
4+
"printWidth": 100
5+
}
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"recommendations": [
3+
"dbaeumer.vscode-eslint",
4+
"esbenp.prettier-vscode",
5+
"editorconfig.editorconfig",
6+
"vue.volar",
7+
"wayou.vscode-todo-highlight"
8+
],
9+
"unwantedRecommendations": [
10+
"octref.vetur",
11+
"hookyqr.beautify",
12+
"dbaeumer.jshint",
13+
"ms-vscode.vscode-typescript-tslint-plugin"
14+
]
15+
}
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"editor.bracketPairColorization.enabled": true,
3+
"editor.guides.bracketPairs": true,
4+
"editor.formatOnSave": true,
5+
"editor.defaultFormatter": "esbenp.prettier-vscode",
6+
"editor.codeActionsOnSave": [
7+
"source.fixAll.eslint"
8+
],
9+
"eslint.validate": [
10+
"javascript",
11+
"javascriptreact",
12+
"typescript",
13+
"vue"
14+
],
15+
"typescript.tsdk": "node_modules/typescript/lib"
16+
}

examples/quasar-project/README.md

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
# Quasar App (quasar-project)
2+
3+
A Quasar Project
4+
5+
## Install the dependencies
6+
```bash
7+
yarn
8+
# or
9+
npm install
10+
```
11+
12+
### Start the app in development mode (hot-code reloading, error reporting, etc.)
13+
```bash
14+
quasar dev
15+
```
16+
17+
18+
### Lint the files
19+
```bash
20+
yarn lint
21+
# or
22+
npm run lint
23+
```
24+
25+
26+
### Format the files
27+
```bash
28+
yarn format
29+
# or
30+
npm run format
31+
```
32+
33+
34+
### Build the app for production
35+
```bash
36+
quasar build
37+
```
38+
39+
### Customize the configuration
40+
See [Configuring quasar.config.js](https://v2.quasar.dev/quasar-cli-vite/quasar-config-js).
Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
import js from '@eslint/js'
2+
import globals from 'globals'
3+
import pluginVue from 'eslint-plugin-vue'
4+
import pluginQuasar from '@quasar/app-vite/eslint'
5+
import { defineConfigWithVueTs, vueTsConfigs, configureVueProject } from '@vue/eslint-config-typescript'
6+
import prettierSkipFormatting from '@vue/eslint-config-prettier/skip-formatting'
7+
8+
9+
configureVueProject({
10+
allowComponentTypeUnsafety: false,
11+
})
12+
13+
export default defineConfigWithVueTs(
14+
{
15+
/**
16+
* Ignore the following files.
17+
* Please note that pluginQuasar.configs.recommended() already ignores
18+
* the "node_modules" folder for you (and all other Quasar project
19+
* relevant folders and files).
20+
*
21+
* ESLint requires "ignores" key to be the only one in this object
22+
*/
23+
// ignores: []
24+
},
25+
26+
pluginQuasar.configs.recommended(),
27+
js.configs.recommended,
28+
29+
/**
30+
* https://eslint.vuejs.org
31+
*
32+
* pluginVue.configs.base
33+
* -> Settings and rules to enable correct ESLint parsing.
34+
* pluginVue.configs[ 'flat/essential']
35+
* -> base, plus rules to prevent errors or unintended behavior.
36+
* pluginVue.configs["flat/strongly-recommended"]
37+
* -> Above, plus rules to considerably improve code readability and/or dev experience.
38+
* pluginVue.configs["flat/recommended"]
39+
* -> Above, plus rules to enforce subjective community defaults to ensure consistency.
40+
*/
41+
pluginVue.configs[ 'flat/essential' ],
42+
43+
{
44+
files: ['**/*.ts', '**/*.vue'],
45+
rules: {
46+
'@typescript-eslint/consistent-type-imports': [
47+
'error',
48+
{ prefer: 'type-imports' }
49+
],
50+
}
51+
},
52+
// https://github.com/vuejs/eslint-config-typescript
53+
vueTsConfigs.strictTypeChecked,
54+
55+
{
56+
languageOptions: {
57+
ecmaVersion: 'latest',
58+
sourceType: 'module',
59+
60+
globals: {
61+
...globals.browser,
62+
...globals.node, // SSR, Electron, config files
63+
process: 'readonly', // process.env.*
64+
ga: 'readonly', // Google Analytics
65+
cordova: 'readonly',
66+
Capacitor: 'readonly',
67+
chrome: 'readonly', // BEX related
68+
browser: 'readonly' // BEX related
69+
}
70+
},
71+
72+
// add your custom rules here
73+
rules: {
74+
'prefer-promise-reject-errors': 'off',
75+
76+
// allow debugger during development only
77+
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
78+
}
79+
},
80+
81+
{
82+
files: [ 'src-pwa/custom-service-worker.ts' ],
83+
languageOptions: {
84+
globals: {
85+
...globals.serviceworker
86+
}
87+
}
88+
},
89+
90+
prettierSkipFormatting
91+
)

examples/quasar-project/index.html

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title><%= productName %></title>
5+
6+
<meta charset="utf-8">
7+
<meta name="description" content="<%= productDescription %>">
8+
<meta name="format-detection" content="telephone=no">
9+
<meta name="msapplication-tap-highlight" content="no">
10+
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (ctx.mode.cordova || ctx.mode.capacitor) { %>, viewport-fit=cover<% } %>">
11+
12+
<link rel="icon" type="image/png" sizes="128x128" href="icons/favicon-128x128.png">
13+
<link rel="icon" type="image/png" sizes="96x96" href="icons/favicon-96x96.png">
14+
<link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png">
15+
<link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png">
16+
<link rel="icon" type="image/ico" href="favicon.ico">
17+
</head>
18+
<body>
19+
<!-- quasar:entry-point -->
20+
</body>
21+
</html>

examples/quasar-project/package.json

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
{
2+
"name": "quasar-project",
3+
"version": "0.0.1",
4+
"description": "A Quasar Project",
5+
"productName": "Quasar App",
6+
"author": "Haoqun Jiang <[email protected]>",
7+
"type": "module",
8+
"private": true,
9+
"scripts": {
10+
"lint": "eslint -c ./eslint.config.js \"./src*/**/*.{ts,js,cjs,mjs,vue}\"",
11+
"format": "prettier --write \"**/*.{js,ts,vue,scss,html,md,json}\" --ignore-path .gitignore",
12+
"test": "echo \"No test specified\" && exit 0",
13+
"dev": "quasar dev",
14+
"build": "quasar build",
15+
"postinstall": "quasar prepare"
16+
},
17+
"dependencies": {
18+
"@quasar/extras": "^1.17.0",
19+
"quasar": "^2.18.1",
20+
"vue": "^3.5.16",
21+
"vue-router": "^4.5.1"
22+
},
23+
"devDependencies": {
24+
"@eslint/js": "^9.29.0",
25+
"@quasar/app-vite": "^2.2.1",
26+
"@types/node": "^22.15.32",
27+
"@vue/eslint-config-prettier": "^10.2.0",
28+
"@vue/eslint-config-typescript": "workspace:*",
29+
"autoprefixer": "^10.4.21",
30+
"eslint": "^9.29.0",
31+
"eslint-plugin-vue": "~10.2.0",
32+
"globals": "^16.2.0",
33+
"prettier": "^3.5.3",
34+
"typescript": "~5.8.3",
35+
"vite-plugin-checker": "^0.9.3",
36+
"vue-tsc": "^2.2.10"
37+
},
38+
"engines": {
39+
"node": "^28 || ^26 || ^24 || ^22 || ^20 || ^18",
40+
"npm": ">= 6.13.4",
41+
"yarn": ">= 1.21.1"
42+
}
43+
}
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
// https://github.com/michael-ciniawsky/postcss-load-config
2+
3+
import autoprefixer from 'autoprefixer'
4+
// import rtlcss from 'postcss-rtlcss'
5+
6+
export default {
7+
plugins: [
8+
// https://github.com/postcss/autoprefixer
9+
autoprefixer({
10+
overrideBrowserslist: [
11+
'last 4 Chrome versions',
12+
'last 4 Firefox versions',
13+
'last 4 Edge versions',
14+
'last 4 Safari versions',
15+
'last 4 Android versions',
16+
'last 4 ChromeAndroid versions',
17+
'last 4 FirefoxAndroid versions',
18+
'last 4 iOS versions'
19+
]
20+
}),
21+
22+
// https://github.com/elchininet/postcss-rtlcss
23+
// If you want to support RTL css, then
24+
// 1. yarn/pnpm/bun/npm install postcss-rtlcss
25+
// 2. optionally set quasar.config.js > framework > lang to an RTL language
26+
// 3. uncomment the following line (and its import statement above):
27+
// rtlcss()
28+
]
29+
}
63 KB
Binary file not shown.
Loading
Loading
Loading
Loading

0 commit comments

Comments
 (0)