Skip to content
On this page

环境配置

  1. 全局编译 TS 文件# 全局安装 typescript 对 TS 进行编译
bash
npm install typescript -g
tsc --init # 生成 tsconfig.json
tsc # 可以将 ts 文件编译成 js 文件
tsc --watch # 监控 ts 文件变化生成 js 文件
1
2
3
4

配置 rollup 环境

安装依赖

bash
npm install rollup typescript rollup-plugin-typescript2 @rollup/plugin-node-resolve rollup-plugin-serve -D
1

初始化 TS 配置文件

npx tsc --init
1

rollup 配置操作

javascript
// rollup.config.js
import ts from 'rollup-plugin-typescript2'
import {nodeResolve} from '@rollup/plugin-node-resolve';
import serve from 'rollup-plugin-serve';
import path from 'path'
export default {
    input:'src/index.ts',
    output:{
        format:'iife',
        file:path.resolve('dist/bundle.js'),
        sourcemap:true
    },
    plugins:[
        nodeResolve({
            extensions:['.js','.ts']
        }),
        ts({
            tsconfig:path.resolve(__dirname,'tsconfig.json')
        }),
        serve({
            open:true,
            openPage:'/public/index.html',
            port:3000,
            contentBase:''
        })
    ]
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

package.json 配置

json
"scripts": {
   "dev": "rollup -c -w"
}
1
2
3

我们可以通过 npm run start 启动服务来使用 typescript 啦~

沪ICP备20006251号-1