Vite 如何配置支持Typescript

2022-06-05 22:00:59 阅读：228 来源： 互联网

标签：Typescript name 配置 ts ESNext test import true Vite

vite并不会校验ts是否通过，需要添加typescript

安装ts

yarn add typescript

校验ts

  "scripts": {
    "dev": "tsc --noEmit && vite",
  },

配置ts
tsconfig.json

{
    "compilerOptions": {
        "target": "ESNext",
        "module": "ESNext",
        "moduleResolution": "node",
        "strict": true,
        "jsx": "preserve",
        "sourceMap": true,
        "resolveJsonModule": true,
        "esModuleInterop": true,
        "lib": ["ESNext","DOM"],
        "isolatedModules": true
    },
    "include": ["src/**/*.ts","src/**/*.d.ts","src/**/*.tsx"]
}

test.ts

interface A {
    name: string
}

export const a: A = {
    name: 'island',
    age: 12
}

使用 App.jsx

import { defineComponent } from "vue";
import classes from "@styles/test.module.css"
import '@styles/test.less'
import { a } from "./test";
export default defineComponent({
    setup() {
        return () => <div className={`${classes.moduleClass}`}>{a.name}-{a.age} <div className="lessBox">less box</div></div>
    }
})

标签：Typescript,name,配置,ts,ESNext,test,import,true,Vite
来源： https://www.cnblogs.com/ltfxy/p/16345264.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

Vite 如何配置支持Typescript