vite-tsx基本配置

751 阅读1分钟

vite配置支持tsx

yarn add @vitejs/plugin-vue-jsx

Vite.config.ts

import { defineConfig } from "vite";
import { resolve } from "path";
import vue from "@vitejs/plugin-vue";
import vueJsx from "@vitejs/plugin-vue-jsx";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue(), vueJsx()],
  server: {
    host: "0.0.0.0", //解决 vite use --host to expose
    port: 8080,
    open: true,
  },
  //配置别名
  resolve: {
    alias: [{ find: "@", replacement: resolve(__dirname, "src") }],
  },
});

Ts.config.json

{
  "compilerOptions": {
    "target": "esnext",
    "useDefineForClassFields": true,
    "module": "esnext",
    "moduleResolution": "node",
    "strict": true,
    "jsx": "preserve",
    "sourceMap": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "lib": ["esnext", "dom"],
    //从这里加的
    "baseUrl": ".",
     "paths": {
      "@/*": ["src/*"]
     },
    "suppressImplicitAnyIndexErrors": true,

  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
}