抖音开放平台Logo
控制台

支持 TypeScript 小程序

更新时间 2024-07-24 02:58:49
收藏
我的收藏
从 3.3.7 版本开始，字节小程序开发者工具将支持 TypeScript 小程序，如果你的 IDE 版本低于该版本，可前往此处下载。​

​开始使用​

​新建 TS 小程序​

在创建小程序项目时，将开发语言勾选为TypeScript ，点击【新建项目】即可直接生成 TS 小程序项目。​
​

​现有 JS 小程序升级为 TS 小程序​

    1.​修改配置文件。​
在project.config.json文件中，新增 setting 下的 useCompilerPlugins 字段为 ["typescript"] ，即可开启小程序编译器中的 typescript 插件。​
    2.​安装依赖。​
    •​确保项目根目录中存在 package.json 文件，该文件与 project.config.json 同级。​
如果项目没有package.json文件，可以选择活动栏的 NPM 按钮，点击 “初始化 package.json” 的来进行创建。​
​
方式一：通过 NPM 功能面板，在 “开发依赖” 的条目上点击 “＋” 新增开发依赖，在弹出的输入框中输入 @douyin-microapp/typings ，等待安装成功。​
​
方式二：在 “终端” 中，通过输入命令，进行手动安装。​
npm install --save-dev @douyin-microapp/typings​
    3.​补充 tsconfig.json 文件。在项目根目录下新建tsconfig.json文件，该文件与 project.config.json 同级。​
官方推荐配置如下：​
json
复制
{
"compilerOptions": {
"strictNullChecks": true,
"noImplicitAny": true,
"module": "CommonJS",
"target": "ES2020",
"allowJs": true,
"allowSyntheticDefaultImports": true,
"esModuleInterop": true,
"experimentalDecorators": true,
"noImplicitThis": true,
"noImplicitReturns": true,
"alwaysStrict": true,
"noFallthroughCasesInSwitch": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"strict": true,
"strictPropertyInitialization": true,
"lib": ["es2020"],
"types": ["@douyin-microapp/typings"]
},
"include": ["./**/*.ts"],
"exclude": ["node_modules"]
}
对于熟悉 typescript 的开发者可以按需调整。​
    4.​将现有的 js 文件修改为 ts 文件。​
目前字节开发者工具在开启 typescript 编译配置后，也支持 js 类型文件，但强烈建议你将项目中的 js 文件后缀名改为 ts ，以获取更好的编辑体验。​
​