基于father build 构建npm包 - bysking

537 阅读1分钟

一、创建一个项目

npx create-father my-father-project

填写基本信息:

image.png

二、新建.fatherrc.ts 打包配置文件

import { defineConfig } from 'father'

export default defineConfig({
    // 浏览器使用,ESModule模块
    esm: {
        input: 'src/client', // 编译目录, 默认src
        platform: 'browser', // 默认构建为 Browser 环境的产物
        transformer: 'babel', // 默认使用 babel 以提供更好的兼容性
    },
    // Node环境使用,CommonJS模块
    cjs: {
        input: 'src/server',
        platform: 'node', // 默认构建为 Node.js 环境的产物
        transformer: 'esbuild', // 默认使用 esbuild 以获得更快的构建速度
    },
    // 以下为 umd 配置项启用时的默认值,有自定义需求时才需配置
    umd: {
        entry: 'src/umd', // 默认构建入口文件
        name: 'BYSKING_UMD',
    },
    // prebundle: {
    //     deps: ['pkg-a', 'pkg-b'], // 需要预打包的依赖包名,需要安装在 `devDependencies` 中
    //     output: 'compiled', // 默认输出目录,有自定义需求时才需配置
    // },
})

三、 package.josn 执行 yarn build 打包

    "scripts": {
        "build": "father build",
        "build:deps": "father prebundle",
        "dev": "father dev",
        "doctor": "father doctor",
        "prepublishOnly": "father doctor && npm run build"
    },

四、测试:通过npm link 或者 yalc link进行调试 yalc

五、发布,直接参考官网