配置rollup环境

安装依赖

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

rollup.config.js

import ts from 'rollup-plugin-typescript2' // 解析ts的插件
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(__dirname, 'dist/bundle.js'),
    sourcemap: true // 根据源码产生映射文件
  },
  plugins: [
    nodeResolve({ // 第三方文件解析
      extensions: ['.js', '.ts']
    }),
    ts({
      // 指定插件的配置文件
      tsconfig: path.resolve(__dirname, 'tsconfig.json')
    }),
    serve({
      openPage: '/public/index.html',
      contentBase: '',
      port: 3000
    })
  ]
}

package.json配置

"scripts": {
  "dev": "rollup -c -w"
}

我们可以通过npm run dev启动服务来使用typescript。