求一个 vite+react 的 js 版本脚手架

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 990 天前的主题，其中的信息可能已经有所发展或是发生改变。

开始学习 React ，自己想用 Vite 作为开发环境，但是被配置 eslint 和 prettier 卡主了，看网上文章每个教的都不太一样，搞不懂 eslint plugin 到底要装哪些，于是想找个脚手架直接上，但是看网上基本上都是 ts 版的脚手架，想问问有没有 V 友能分享一下在维护的 js 版本的 vite 脚手架

脚手架

vite

eslint

prettier

16 条回复 • 2022-07-01 15:09:20 +08:00

xujiahui

2022-04-14 11:17:47 +08:00

放弃 eslint 就简单了，https://github.com/vitejs/awesome-vite 这个里面有各种各样的模板

Removable

2022-04-14 11:22:44 +08:00

@xujiahui #1 哈哈哈我也不用 eslint ，只用 prettier （ ps:后端选手业余写写 react

stille

2022-04-14 11:28:28 +08:00

最近学习 vue 也是 eslint 搞懵逼了,脚手架里一套,vscode 插件又一套.实在不知道该怎么配了.

TWorldIsNButThis

2022-04-14 11:37:06 +08:00

这个之前搞了我好几天，也是各种冲突和不适用的老规则
最后定下来是用 eslint 驱动 prettier ，装
eslint-config-prettier
eslint-plugin-prettier
然后在 eslintrc 里写 eslint 和 prettier 的配置

{
"env": {"browser": true, "es2021": true},
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"plugin:@typescript-eslint/recommended",
"plugin:react-hooks/recommended",
"plugin:prettier/recommended"
],
"parser": "@typescript-eslint/parser",
"parserOptions": {"ecmaFeatures": {"jsx": true}, "ecmaVersion": "latest", "sourceType": "module"},
"settings": {
"react": {
"version": "detect"
}
},
"plugins": ["react", "@typescript-eslint"],
"rules": {
"quotes": ["error", "single"],
"semi": ["error", "never"],
"react/react-in-jsx-scope": "off",
"prettier/prettier": [
"error",
{
"trailingComma": "es5",
"singleQuote": true,
"printWidth": 120,
"semi": false,
"plugins": ["prettier-plugin-tailwindcss"],
"tailwindConfig": "./tailwind.config.js",
"endOfLine": "auto"
}
]
},
"ignorePatterns": ["**/*.config.*", "dist/**/*"]
}