- 模块化
- 兼容浏览器，编译高级语法
- 线上代码的质量
- 开发效率、项目的冷启动/二次启动时间、热更新时间
- 模块化方面，Vite 基于浏览器原生 ESM 的支持实现模块加载，并且无论是开发环境还是生产环境，都可以将其他格式的产物(如 CommonJS)转换为 ESM。
- 语法转译方面，Vite 内置了对 TypeScript、JSX、Sass 等高级语法的支持，也能够加载各种各样的静态资源，如图片、Worker 等等。
- 产物质量方面，Vite 基于成熟的打包工具 Rollup 实现生产环境打包，同时可以配合Terser、Babel等工具链，可以极大程度保证构建产物的质量。
-
一个import 语句即代表一个 HTTP 请求
-
"一个 import 语句代表一个 HTTP 请求",如果发送请求较多，会不会占用IO线程等其他问题？
- 请求数量太多的话首屏加载会比较慢，但后续由于有协商缓存，一般情况下页面加载性能也是可以接受的
-
vite是不支持vue2的构建吗？
- vite-plugin-vue2
-
如果在导入path的时候报错，说找不到path模块，需要安装：pnpm install @types/node --save-dev； 安装成功后，如果显示path只能在使用"allowSyntheticDefaultImports"标志时进行默认导入，需要去tsconfig.node. json文件中，在compilerOptions中设置一条属性："allowSyntheticDefaultImports": true。如果tsconfig.json里配置了allowSyntheticDefaultImports还是报错，有可能是配置了"references": [{ "path": "./tsconfig.node.json" }]，然后再去tsconfig.node.json配置"allowSyntheticDefaultImports": true就可以了
- Tailwind CSS IntelliSense 没有提示的话
- settings-json设置
"tailwindCSS.includeLanguages": {
"html": "html",
"javascript": "javascript",
"css": "css"
},
"tailwindCSS.classAttributes": ["class", "className", "ngClass"],
"editor.quickSuggestions": { "strings": true }import { AttributifyAttributes } from 'windicss/types/jsx'
declare module 'react' {
interface HTMLAttributes<T> extends AttributifyAttributes {}
}
#改一下shim.d.ts的配置。三元写的这种不生效了-
tailwind和postcss的配置文件，在Vite3.X版本要把后缀名改为.cjs, 不然会报模块错误。
-
我找到了如何配置自动注入less的配置了 github.com 除此之外 如果要配置umi中的文件自动注入可以参考 github.com
-
在src下面新建types/shim.d.ts
-
补充, styled component中需要更好的debug可以参考github.com 这样可以显示一些有意义的className前缀