V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
Exuanbo
V2EX  ›  分享创造

写了个 rollup 小插件, rollup-plugin-esbuild-transform

  •  1
     
  •   Exuanbo ·
    exuanbo · 2021-08-27 19:19:44 +08:00 · 1284 次点击
    这是一个创建于 1209 天前的主题,其中的信息可能已经有所发展或是发生改变。

    esbuildrollup 构建中转译 JavaScript, TypeScript, JSX, JSON 等文件内容类型, 支持 esbuild Transform API 所有的选项。

    项目仓库

    rollup-plugin-esbuild-transform

    为什么

    esbuild 在打包时有一些问题,比如从去年至今依然没有修复的 #475

    EGOIST 大佬写的 rollup-plugin-esbuild 很棒,但是如果需要多个 loader 每个不同选项就有些麻烦, 而且不知为什么没有暴露出 esbuild.transform 完整的 API.

    示例

    // rollup.config.js
    
    import esbuild from 'rollup-plugin-esbuild-transform'
    
    export default {
      plugins: [
        esbuild([
          {
            loader: 'json',
            minifyWhitespace: true
          },
          {
            loader: 'ts'
          },
          {
            loader: 'tsx',
            banner: "import * as React from 'react'"
          },
          {
            loader: 'js',
            include: /\.[jt]sx?$/,
            target: 'es2017'
          }
        ]) 
      ]
    }
    

    include 选项

    默认值为 new RegExp(`\\.${loader === 'js' ? '(?:js|cjs|mjs)' : loader}$`)

    如果一个文件被多个选项匹配 (像上面的例子中), 除了 loader 以外的其他选项会被 Object.assign() 合并。

    // 比如文件 index.tsx
    [
      {
        loader: 'tsx',
        banner: "import * as React from 'react'"
      },
      {
        loader: 'js',
        include: /\.[jt]sx?$/,
        target: 'es2017'
      }
    ]
    
    // 最终传到 esbuild.transform 的选项会变成
    {
      loader: 'tsx',
      banner: "import * as React from 'react'",
      target: 'es2017'
    }
    

    exclude 选项

    默认值为 /node_modules/, 优先于 include 匹配。

    目前尚无回复
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1838 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 62ms · UTC 16:21 · PVG 00:21 · LAX 08:21 · JFK 11:21
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.