# stan-builder

> build js library

Latest version **0.22.0** (published 2023-12-09) · MIT license · 0 weekly downloads

## Install

```sh
npm install stan-builder
pnpm add stan-builder
yarn add stan-builder
bun add stan-builder
```

Provides the command `stan-builder`.

## Health

**Score 40/100 (D)** — status: abandoned.

Positive: has types; no vulnerabilities; high maintenance score; high quality score.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.22.0 |
| Published | 2023-12-09 |
| First published | 2020-10-06 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 53 |
| Unpacked size | 95.1 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 24 |
| Author | fupeng |
| Maintainers | fupengl |
| Keywords | stan, @planjs, builder, react, react-compoments, vue, vue-compoments, node, node-library, lib, library, babel, rollup, stan-builder |

## Links

- npm: https://www.npmjs.com/package/stan-builder
- Repository: https://github.com/planjs/stan
- Homepage: https://github.com/planjs/stan/blob/master/packages/stan-builder/README.md
- Issues: https://github.com/planjs/stan/issues
- npm.io page: https://npm.io/package/stan-builder

## Dependencies (53)

- [merge2](https://npm.io/package/merge2.md) ^1.4.1
- [rollup](https://npm.io/package/rollup.md) ^2.77.2
- [cssnano](https://npm.io/package/cssnano.md) ^5.1.12
- [gulp-if](https://npm.io/package/gulp-if.md) ^3.0.0
- [postcss](https://npm.io/package/postcss.md) ^8.2.7
- [escalade](https://npm.io/package/escalade.md) ^3.1.1
- [fsevents](https://npm.io/package/fsevents.md) ~2.3.2
- [through2](https://npm.io/package/through2.md) ^4.0.2
- [vinyl-fs](https://npm.io/package/vinyl-fs.md) ^3.0.3
- [stan-utils](https://npm.io/package/stan-utils.md) 0.17.0
- [@babel/core](https://npm.io/package/@babel/core.md) ^7.14.2
- [gulp-filter](https://npm.io/package/gulp-filter.md) ^7.0.0
- [gulp-terser](https://npm.io/package/gulp-terser.md) ^2.1.0
- [@svgr/rollup](https://npm.io/package/@svgr/rollup.md) ^6.3.1
- [autoprefixer](https://npm.io/package/autoprefixer.md) ^10.4.8
- [gulp-plumber](https://npm.io/package/gulp-plumber.md) ^1.2.1
- [gulp-postcss](https://npm.io/package/gulp-postcss.md) ^9.0.1
- [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.15.4
- [@babel/register](https://npm.io/package/@babel/register.md) ^7.13.16
- [builtin-modules](https://npm.io/package/builtin-modules.md) ^3.3.0
- [gulp-sourcemaps](https://npm.io/package/gulp-sourcemaps.md) ^3.0.0
- [gulp-typescript](https://npm.io/package/gulp-typescript.md) ^6.0.0-alpha.1
- [@babel/preset-env](https://npm.io/package/@babel/preset-env.md) ^7.14.2
- [@rollup/plugin-url](https://npm.io/package/@rollup/plugin-url.md) ^7.0.0
- [@babel/preset-react](https://npm.io/package/@babel/preset-react.md) ^7.13.13
- [@rollup/plugin-json](https://npm.io/package/@rollup/plugin-json.md) ^4.1.0
- [@rollup/pluginutils](https://npm.io/package/@rollup/pluginutils.md) ^4.2.1
- [postcss-load-config](https://npm.io/package/postcss-load-config.md) ^3.0.0
- [@rollup/plugin-alias](https://npm.io/package/@rollup/plugin-alias.md) ^3.1.9
- [@rollup/plugin-babel](https://npm.io/package/@rollup/plugin-babel.md) ^5.3.1
- [rollup-plugin-terser](https://npm.io/package/rollup-plugin-terser.md) ^7.0.2
- [@rollup/plugin-inject](https://npm.io/package/@rollup/plugin-inject.md) ^4.0.4
- [rollup-plugin-postcss](https://npm.io/package/rollup-plugin-postcss.md) ^4.0.2
- [vue-template-compiler](https://npm.io/package/vue-template-compiler.md) ^2.6.12
- [@rollup/plugin-replace](https://npm.io/package/@rollup/plugin-replace.md) ^4.0.0
- [less-plugin-npm-import](https://npm.io/package/less-plugin-npm-import.md) ^2.1.0
- [@rollup/plugin-commonjs](https://npm.io/package/@rollup/plugin-commonjs.md) ^22.0.2
- [@babel/preset-typescript](https://npm.io/package/@babel/preset-typescript.md) ^7.13.0
- [rollup-plugin-visualizer](https://npm.io/package/rollup-plugin-visualizer.md) ^5.7.1
- [rollup-plugin-typescript2](https://npm.io/package/rollup-plugin-typescript2.md) ^0.32.1
- [@rollup/plugin-node-resolve](https://npm.io/package/@rollup/plugin-node-resolve.md) ^13.3.0
- [@babel/plugin-transform-spread](https://npm.io/package/@babel/plugin-transform-spread.md) ^7.13.0
- [@babel/plugin-transform-runtime](https://npm.io/package/@babel/plugin-transform-runtime.md) ^7.14.2
- [@types/rollup-plugin-visualizer](https://npm.io/package/@types/rollup-plugin-visualizer.md) ^4.2.1
- [@babel/plugin-proposal-decorators](https://npm.io/package/@babel/plugin-proposal-decorators.md) ^7.14.2
- [@babel/plugin-syntax-dynamic-import](https://npm.io/package/@babel/plugin-syntax-dynamic-import.md) ^7.8.3
- [@babel/plugin-proposal-do-expressions](https://npm.io/package/@babel/plugin-proposal-do-expressions.md) ^7.14.0
- [@babel/plugin-proposal-optional-chaining](https://npm.io/package/@babel/plugin-proposal-optional-chaining.md) ^7.14.2
- [@babel/plugin-transform-modules-commonjs](https://npm.io/package/@babel/plugin-transform-modules-commonjs.md) ^7.14.0
- [@babel/plugin-proposal-object-rest-spread](https://npm.io/package/@babel/plugin-proposal-object-rest-spread.md) ^7.14.2
- [@babel/plugin-proposal-export-default-from](https://npm.io/package/@babel/plugin-proposal-export-default-from.md) ^7.12.13
- [@babel/plugin-proposal-export-namespace-from](https://npm.io/package/@babel/plugin-proposal-export-namespace-from.md) ^7.14.2
- [@babel/plugin-proposal-nullish-coalescing-operator](https://npm.io/package/@babel/plugin-proposal-nullish-coalescing-operator.md) ^7.14.2

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.22.0 (latest) — 2023-12-09
- 0.21.0 — 2023-12-08
- 0.20.0 — 2023-02-22
- 0.19.3 — 2023-01-16
- 0.19.2 — 2022-10-11
- 0.19.1 — 2022-08-09
- 0.19.0 — 2022-08-07
- 0.18.2 — 2022-06-26
- 0.18.1 — 2022-06-26
- 0.18.0 — 2022-06-25
- 0.17.1 — 2022-06-14
- 0.17.0 — 2022-05-17
- 0.16.7 — 2022-05-16
- 0.16.6 — 2022-05-16
- 0.16.5 — 2022-05-15
- … 102 more at https://npm.io/package/stan-builder/versions

## README

[npm]: https://img.shields.io/npm/v/stan-builder
[npm-url]: https://www.npmjs.com/package/stan-builder
[download]: http://img.shields.io/npm/dm/stan-builder.svg?style=flat
[test]: https://github.com/planjs/stan/actions/workflows/test.yml/badge.svg
[size]: https://packagephobia.now.sh/badge?p=stan-builder
[size-url]: https://packagephobia.now.sh/result?p=stan-builder

[![npm][npm]][npm-url]
[![size][size]][size-url]
[![test][test]][test]
[![NPM downloads][download]][npm-url]

# `stan-builder`

> 集成 `rollup` `babel` 常用打包配置.

## Install

Using npm:

```console
npm install stan-builder --save-dev
```

## Features
* ✔︎ 支持 typeScript
* ✔︎ 支持 cjs、esm、umd、systemjs 四种格式的打包
* ✔︎ esm 支持生成 mjs，直接为浏览器使用
* ✔︎ 支持 postcss
* ✔︎ 支持打包成 node browser 用的代码

## Usage

```shell script
# Bundle library
stan-builder --esm --cjs --minify 

# Bundle dev
stan-builder -w
```

## Config
新建配置文件 `.stanrc.ts` `.stanrc.js` `.stanrc.tsx`
```typescript
// BundleOptions
export default {
  esm: true,
  umd: true,
  target: 'browser',
}
```

### Bundle Options
#### entry

指定入口文件。

* Type: `string`
* Default：`src/index.js`

默认会查找 `src/index.tsx`, `src/index.ts`, `src/index.jsx`, `src/index.js`, `src/index.vue`，如果存在，则会作为默认的 entry。如果库文件为 `typescript`，则需要在根目录配置`tsconfig.json`，否则会编译错误。
`babel` 模式下是编译 `entry` 所在文件夹的所有文件。

> 如果是 `vue` 默认使用的是 `vue3` `rollup-plugin-vue@6.x`, 如果是 `vue2` 请项目内安装 `rollup-plugin-vue@5.x`

#### file 

指定输出文件名。

* Type: `string`
* Default：与 `entry` 相同的文件名，`entry.[umd|cjs|esm].[min].js` 默认自动增加后缀。

> - `[esm|cjs|umd].file` 优先级比这个高，没有配置则默认这个。

#### bundler

打包工具。

* Type: `rollup | babel`
> - `umd` `systemjs` 规范只支持使用 `rollup`。

#### runtimeHelpers

是否把 helper 方法不打包引入 `@babel/runtime` 。

> - 推荐开启，减少打包体积，公用项目内的 `runtime`。
> - 开启 `runtimeHelpers`，一定要在 dependencies 里有 `@babel/runtime` 依赖
> - `runtimeHelpers` 只对 esm 有效，cjs 下无效，因为 cjs 已经不给浏览器用了。

#### minify

是否压缩代码。

* Type: `boolean`
* Default: `false`

> - 开启会自动生成`.min`后缀的文件。  
> - `css` 使用 `postcss`，`js` 使用 `terser`。
> - `[esm|cjs|umd].minify` 优先级比这个高，没有配置则默认这个。
 
#### extractCSS

配置是否提取 css 为单独文件。

* Type: `boolean`
* Default: `false`
 
#### injectCSS

是否在 `<head>` 里注入css。

* Type: `boolean`
* Default: `true`

#### sourcemap
 
是否同步输出sourcemap。

* Type: `boolean`
* Default: `false`

#### esm

输出`esm`规范的代码。

* Type：`"rollup" | "babel" | { type, file, mjs, bundler, minify, sourcemap, target, runtimeHelpers } | `boolean``

#### cjs

输出`cjs`规范的代码。

* Type：`"rollup" | "babel" | { type, file, lazy, bundler, minify, sourcemap, target, runtimeHelpers } | `boolean``

#### cjs.lazy

是否开启 lazy require。

* Type: `boolean`
* Default: `false`

> 可加速命令行执行速度，同时减少依赖和耦合。

#### umd 

输出`umd`规范的代码。

* Type： `"rollup" | "babel" | { type, file, name, global, bundler, minify, sourcemap, target, runtimeHelpers } | `boolean``

#### umd.name

指定 `rollup` 的 [name](https://rollupjs.org/guide/en/#output-name) 配置。

* Type: `string` 
* Default：默认 camelCase packages.json 中的 `name`

#### umd.global

指定 `rollup` 的 [global](https://rollupjs.org/guide/en/#output-globals) 配置。

* Type: `react=React,react-dom=ReactDom | { pkg: global name }`

> - `external` 中的包默认会 camelCase 作为默认值。

#### system 

输出`systemjs`规范的代码，默认使用`rollup`。

* Type：`boolean`

#### target

配置是 node 库还是 browser 库，只作用于语法层。

* Type: `"node" | "browser"`
* Default: `"browser"`

> - 如果 `entry` 后缀为 `.jsx|.tsx` 默认为 `browser`。 

#### extraBabelPlugins

配置额外的 babel plugins。

* Type: `array`
* Default: `[]`

#### extraBabelPresets

配置额外的 babel preset。

* Type: `array`
* Default: `[]`

#### extraExternals

配置一些依赖走 externals。

* Type: `array<string | RegExp>`
* Default: []

> * rollup 的 external 保留内部默认处理，新增 external   
> * 打包esm, cjs时 dependencies 和 peerDependencies 里的内容会被 external   
> * 打包umd时 peerDependencies 会被 external

#### externalsExclude

配置一些依赖不走 externals。

* Type: `array<string | RegExp>`
* Default: `[]`

#### externalPeerDependenciesOnly

只 externals `peerDependencies` 中的依赖。

* Type: `string[]`
* Default: `[]`

#### extraPostCSSPlugins

配置额外 postcss plugin

* Type: `string[]`
* Default: `[]`

#### extraRollupPlugins

配置额外 rollup plugin

* Type: `array`
* Default: `[]`

#### analyze

是否可视化展示打包的模块大小，使用 [rollup-plugin-visualizer](https://github.com/btd/rollup-plugin-visualizer) 。

* Type: `boolean`
* Default: `false`

#### copy.targets

是否打包同时复制文件。

* Type: `{ src, dest, rename, transform } | array` 
* Default: `undefined`

> - 这里使用 [globby](https://github.com/sindresorhus/globby) 匹配文件。
> - 如果 watch 模式，匹配到的文件也会 watch 并且copy。

#### copy.flatten

是否复制的时候删除目录结构。

* Type: `boolean`
* Default: `true`

#### rollup plugin options

* `nodeResolveOpts`: [@rollup/plugin-node-resolve](https://github.com/rollup/plugins/blob/master/packages/node-resolve/README.md)
* `replaceOpts`: [@rollup/plugin-replace](https://github.com/rollup/plugins/blob/master/packages/replace/README.md)
* `commonjsOpts`: [@rollup/plugin-commonjs](https://github.com/rollup/plugins/blob/master/packages/commonjs/README.md)
* `injectOpts`: [@rollup/plugin-inject](https://github.com/rollup/plugins/blob/master/packages/inject/README.md)
* `terserOpts`: [rollup-plugin-terser](https://github.com/TrySound/rollup-plugin-terser)
* `typescript2Opts`: [rollup-plugin-typescript2](https://github.com/ezolenko/rollup-plugin-typescript2)
   > 如果项目内有 `typescript` 默认 `declaration: true`
* `aliasOpts`: [@rollup/plugin-alias](https://github.com/rollup/plugins/blob/master/packages/alias/README.md)
* `visualizerOpts`: [rollup-plugin-visualizer](https://github.com/btd/rollup-plugin-visualizer)
* `postcssOpts`: [rollup-plugin-postcss](https://github.com/egoist/rollup-plugin-postcss#readme)

> 如果是 ts 可以参考 `stan-builder/typings/types.d.ts` 中的 `BundleOptions`

## Usage in node
```js
const builder = require('stan-builder');

builder({ 
  verbose: true
}).then(() => {
    console.log("Build complete.")
})
```

---
_Source: https://npm.io/package/stan-builder · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._