1 | <p align="center">
|
2 | <img alt="Logo" src="https://next.pikapkg.com/static/img/new-logo1.png" width="280">
|
3 | </p>
|
4 |
|
5 | <p align="center">
|
6 | <strong>@pika/pack</strong> • npm package building, reimagined.
|
7 | </p>
|
8 |
|
9 | <p align="center">
|
10 | <img alt="Demo" src="https://next.pikapkg.com/static/img/pack-build-demo.gif?" width="720">
|
11 | </p>
|
12 |
|
13 |
|
14 | ## @pika/pack helps you build amazing packages without the hassle:
|
15 |
|
16 | - **Simple** ⚡️ Use pre-configured plugins to build your package for you.
|
17 | - **Flexible** 🏋️♀️ Choose plugins and optimizations to match your needs.
|
18 | - **Holistic** ⚛️ Let us build the entire package... *including package.json.*
|
19 |
|
20 |
|
21 | ## Quickstart
|
22 |
|
23 | Getting started is easy:
|
24 |
|
25 | ```js
|
26 | // 1. Install it!
|
27 | $ npm install -g @pika/pack
|
28 | // 2. Add this to your package.json manifest:
|
29 | "@pika/pack": {
|
30 | "pipeline": []
|
31 | }
|
32 | // 3. Run it!
|
33 | $ pack build
|
34 | ```
|
35 |
|
36 | ### 😎 🆒
|
37 |
|
38 | So now what? If you run `pack build` with an empty pipeline, you'll get an empty package build. **@pika/pack** lets you connect pre-configured plugins to build and optimize your package for you. Plugins wrap already-popular tools like Babel and Rollup with npm-optimized config options, removing the need to fiddle with much (if any) configuration yourself. You even get a generated package.json manifest configured for you ***automatically***.
|
39 |
|
40 | ### 1. Create a project pipeline out of simple, pluggable builders.
|
41 |
|
42 | ```js
|
43 | // Before: Your top-level package.json manifest:
|
44 | {
|
45 | "name": "simple-package",
|
46 | "version": "1.0.0",
|
47 | "@pika/pack": {
|
48 | "pipeline": [
|
49 | ["@pika/plugin-standard-pkg", {"exclude": ["__tests__/**/*"]}],
|
50 | ["@pika/plugin-build-node"],
|
51 | ["@pika/plugin-build-web"],
|
52 | ["@pika/plugin-build-types"]
|
53 | ]
|
54 | }
|
55 | }
|
56 | ```
|
57 |
|
58 | Builders are simple, single-purpose build plugins defined in your `package.json`. For example, `@pika/plugin-build-node` & `@pika/plugin-build-web` build your package for those different environments. Other, more interesting builders can bundle your web build for [unpkg](https://unpkg.com), generate TypeScript definitions from your JavaScript, addon a standard CLI wrapper for Node.js builds, and even compile non-JS languages to WASM (with JS bindings added).
|
59 |
|
60 | ### 2. Builders handle everything, including package configuration.
|
61 |
|
62 | ```js
|
63 | // After: your built "pkg/" package.json manifest:
|
64 | {
|
65 | "name": "simple-package",
|
66 | "version": "1.0.0",
|
67 | // Multiple distributions, built & configured automatically:
|
68 | "esnext": "dist-src/index.js",
|
69 | "main": "dist-node/index.js",
|
70 | "module": "dist-web/index.js",
|
71 | "types": "dist-types/index.d.ts",
|
72 | // With sensible package defaults:
|
73 | "sideEffects": false,
|
74 | "files": ["dist-*/", "assets/", "bin/"]
|
75 | }
|
76 | ```
|
77 |
|
78 | This is all possible because **@pika/pack** builds your entire package: code, assets, and even package.json manifest. By building the entire package, you end up with a fully-built `pkg/` directory, ready to publish. Entry points like "main", "module", "umd:main", "types", "unpkg", "files", and even advanced options like "sideEffects" are all handled by your build pipeline.
|
79 |
|
80 |
|
81 | ## Build Plugins
|
82 |
|
83 | **[Check out the full list](https://github.com/pikapkg/builders)** of official & community-written @pika/pack plugins!
|
84 |
|
85 |
|
86 | ## Lerna Support
|
87 |
|
88 | Curious about integrating @pika/pack with Lerna? Our official collection of plugins is a Lerna repo that uses @pika/pack to build each package! [Check it out](https://github.com/pikapkg/builders) to see how easy it is to use the two tools together.
|
89 |
|
90 |
|
91 | ## Bonus Command: `publish`
|
92 |
|
93 | <p align="center" style="margin-bottom: 0rem;">
|
94 | <img alt="Demo" src="https://next.pikapkg.com/static/img/publish-demo.gif" width="720">
|
95 | </p>
|
96 |
|
97 | We've brought our favorite parts of [np](https://github.com/sindresorhus/np) (a self-described "better npm publish") into **@pika/pack**. With the `publish` command there's no need to worry about how to publish your package once you've built it.
|
98 |
|
99 | Run `pack publish` in your project and **@pika/pack** will walk you through version bumping, tagging your release, generating a fresh build, and finally publishing your package.
|