Giter VIP home page Giter VIP logo

zmi-nerd's Introduction

🔨 zmi-nerd

Simple transform tool

lerna GitHub license codecov <ORG_NAME>

Features

  • 📌 支持 TypeScript
  • 📌 支持 lerna
  • 📌 支持 babelesbuild 打包
  • 📌 支持 cjsesm
  • 📌 支持 自定义 Stream 扩展, 支持 gulp 插件
  • 📌 支持 小程序编译
  • 📌 支持 增量编译

Installation

Install zmi-nerd via yarn or npm.

$ yarn add zmi-nerd

Usage

# Bundle library
$ nerd build

# Watch dev
$ nerd build --watch

Config

新建 .nerdrc.js or .nerdrc.ts 文件进行配置。

import { IConfig } from 'zmi-nerd'

export default {
  moduleType: 'cjs',
  target: 'node',
  paths: {
    '@': './src'
  }
} as IConfig

tsconfig.json

会自动读取 tsconfig.jsoncompilerOptions 的配置进行编译 ts or tsx, 如果是 lerna 项目, 也会继承外部 tsconfig.jsoncompilerOptions 的配置

Options

esBuild

是否以 esBuild 打包

  • Type: boolean
  • Default: false

moduleType

输出格式,打包方式等

  • Type: "cjs" | "esm"
  • Default: "esm"

extraBabelPresets

配置额外的 Babel presets。

  • Type: array
  • Default: []

extraBabelPlugins

添加 Babel Plugins

  • Type: array
  • Default: []

target

node 库 or browser 库,只作用于语法层。

  • Type: "node" | "browser"
  • Default: "browser"

node,兼容到 node@6 browser,兼容到 ['last 2 versions', 'IE 10']

react

支持 jsx or tsx

  • Type: boolean
  • Default: false

paths

路径别名, 参考 webpack alias 参数, 支持大部分主流文件类型, 支持小程序

  • Type: object
  • Default: undefined
import path from 'path'
const root = path.join(__dirname, './src')

export default {
  paths: {
    '@': root,
    '@pkg': path.join(root, 'index'),
    '@utils': path.join(root, 'utils')
  }
}

browserFiles

target 为 node 时,配置例外文件走 browser target。

  • Type: [string]
  • Default: []

注:所有 .tsx.jsx 文件始终走 browser target。

nodeFiles

target 为 browser 时,配置例外文件走 node target。

  • Type: [string]
  • Default: []

runtimeHelpers

是否把 helper 方法提取到 @babel/runtime 里。

  • Type: boolean
  • Default: false

注:

  1. 配置了 runtimeHelpers,要在 dependencies 里安装 @babel/runtime 依赖
  2. runtimeHelpers 只对 esm 有效

disableTypes

是否禁用类型检测, 将不会生成 d.ts

  • Type: boolean
  • Default: false

beforeReadWriteStream

编译中 hook, 在没有进行任何处理之前

  • Type: function
  • Default: undefined

注:

  1. 会传入两个参数
  2. 可以直接使用 gulp 插件
export default {
  beforeReadWriteStream({ through, insert }) {
    return through.obj((chunk, _, cb) => {
      cb(null, chunk)
    })

    return insert.transform((content, file) => {
      return content
    })

    return gulpLess()
  }
}

afterReadWriteStream

编译中 hook, 在进行编译处理之后

  • Type: function
  • Default: undefined

注:

  1. 会传入两个参数,
  2. 可以直接使用 gulp 插件
export default {
  beforeReadWriteStream({ through, insert }) {
    return through.obj((chunk, _, cb) => {
      cb(null, chunk)
    })

    return insert.transform((content, file) => {
      return content
    })
  }
}

pkgs

在 lerna 构建中,有可能出现组件间有构建先后的需求 pkgs 允许你自定义 packages 目录下的构建顺序, 当使用pkgs的时候没有在pkgs里面的目录不会进行编译

  • Type: string[]
  • Default: []
export default {
  pkgs: ['packagesA', 'packagesB']
}

注:

  1. 如果是 lerna 项目,没有传 pkgs 全部目录将进行编译
  2. 子目录的配置文件会继承最外层的配置, tsconfig 也会继承

entry

编译监听目录

  • Type: string
  • Default: src

output

编译输出目录

  • Type: string
  • Default: lib

zmi-nerd's People

Contributors

zoy-l avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.