webstorm 创建运行纯Typescript项目

创建一个空项目，在项目根目录创建一个tsconfig.json文件
自动配置：

打开终端输入tsc --init，即可自动生成tsconfig.json文件
手动配置：

在项目根目录下新建一个tsconfig.json文件,并配置如下内容

具体配置可以直接使用下面的配置，详细配置可以去官网查考每一个属性对应的作用

官网地址：https://www.tslang.cn/docs/handbook/compiler-options.html

{  "compilerOptions": {    "target": "esnext",    "useDefineForClassFields": true,    "module": "esnext",    "moduleResolution": "node",    "strict": true,    "noLib": false,    "sourceMap": true,    "resolveJsonModule": true,  // JSON模块导入允许    "esModuleInterop": true,    "lib": ["esnext", "dom"],    "baseUrl": ".",    "allowJs": true,  //编译JS  /*  "paths": {      "@*//*": ["src*//*"]    },*/    "types": ["vite/client", "unplugin-icons/types/vue", "element-plus/global"],    "skipLibCheck": true /* Skip type checking all .d.ts files. */,    "allowSyntheticDefaultImports": true /* 允许默认导入 */,    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,    "jsx": "preserve",    "jsxFactory": "h",    "jsxFragmentFactory": "Fragment"  },  "include": [    "src/**/*.ts",    "src/**/*.vue",    "src/typings/**/*.d.ts",    "mock/**/*.ts",    "vite.config.ts",    "vite.config.ts",    "types/**/*.ts"  ],  "exclude": ["node_modules", "dist", "**/*.js"]}

 配置TS

配置TS文件监控

创建一个TS

class Student {  fullName: string;  constructor(public firstName: any, public middleInitial: any, public lastName: any) {    this.fullName = firstName + " " + middleInitial + " " + lastName;  }}interface Person {  firstName: string;  lastName: string;}function greeter(person: Person) {  return "Hello, " + person.firstName + " " + person.lastName;}let user = new Student("Jane", "M.", "User");console.log(greeter(user));

编译生成JS

tsc src/classGreeter

运行： node .\src\classGreeter.js

直接右键run命令

run这个命令，这个时候进行如下操作：

①安装直接运行所需依赖包： npm install -g ts-node

2.安装插件：Run Configuration for TypeScript

 在插件里安装失败

直接去网页： Run Configuration for TypeScript - IntelliJ IDEs Plugin | Marketplace下载jar包，然后导入插件也可以用

右键运行效果