Allen's blog Allen's blog
首页
面经
算法 (opens new window)
分类

Allen

前端CV工程师
首页
面经
算法 (opens new window)
分类
  • Javascript

  • TypeScript

  • CSS

  • Vue

  • React

  • 框架和构建工具

  • 工具库

  • 常见业务场景

  • Bug

  • 项目实战

    • 飞书多维表格React项目

    • tj-school-vue2

    • my-linter

      • rollup打包配置
        • vitest单元测试
        • 设置路径别名
      • chrome-extension

      • 特征采集系统electron

    • 前端
    • 项目实战
    • my-linter
    Allen
    2023-10-07
    目录

    rollup打包配置

    import { defineConfig } from 'rollup'
    import ts from '@rollup/plugin-typescript'
    import commonjs from '@rollup/plugin-commonjs'
    import resolve from '@rollup/plugin-node-resolve'
    import dts from 'rollup-plugin-dts'
    import json from '@rollup/plugin-json'
    
    const config = defineConfig([
        // 输出两种模式:ES Module和CommonJS
        {
            input: ['src/index.ts'],
            output: [
                {
                    dir: 'dist/esm',
                    format: 'es'
                },
                {
                    dir: 'dist/cjs',
                    format: 'cjs'
                }
            ],
            plugins: [resolve({ preferBuiltins: true }), commonjs(), ts(), json()],
            external: ['readable-stream']
        },
        // 打包类型声明
        {
            input: 'src/index.ts',
            output: {
                dir: 'dist/',
                format: 'esm',
                preserveModules: true
            },
            plugins: [dts()]
        }
    ])
    
    export default config
    
    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
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37

    # 1. 循环引用

    nodejs 中的 readable stream 和 duplex stream 两个模块之间产生了循环引用。具体来说就是 Duplex(在_stream_duplex.js 中定义)继承了 Readable(在_stream_readable.js 中定义),但是在 ReadableState(也在_stream_readable.js 中定义)中做了和 Duplex 类型相关的检查,因此在代码执行的过程中引入了_stream_duplex.js,构成了循环引用。

    在 rollup.config.ts 中配置 external: ['readable-stream']

    # 2. 输出环境

    https://github.com/chalk/chalk/issues/578

    https://github.com/rollup/plugins/tree/master/packages/node-resolve/#readme

    设置@rollup/plugin-node-resolve 解析环境为 node

    {
        plugins: [
            resolve: {
                exportConditions:['node']
            }
        ]
    }
    
    1
    2
    3
    4
    5
    6
    7
    上次更新: 2023/12/16, 09:22:46
    自适应不同屏幕尺寸
    vitest单元测试

    ← 自适应不同屏幕尺寸 vitest单元测试→

    最近更新
    01
    rollup使用配置文件rollup.config.ts打包
    12-08
    02
    package.json导出类型
    12-08
    03
    关键问题方案
    11-17
    更多文章>
    Theme by Vdoing | Copyright © 2023-2023 Allen | Github
    • 跟随系统
    • 浅色模式
    • 深色模式
    • 阅读模式