Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/egoist/poi

⚡A zero-config bundler for JavaScript applications.
https://github.com/egoist/poi

babel build-tool bundle postcss preact react svelte typescript vue vuejs webpack

Last synced: 3 months ago
JSON representation

⚡A zero-config bundler for JavaScript applications.

Awesome Lists containing this project

README

        

# ⚠️ Poi has been deprecated, please migrate to [Vite](https://vitejs.dev), contact me personally if you need help.





[![npm version](https://badgen.net/npm/v/poi)](https://npm.im/poi) [![build status](https://badgen.net/circleci/github/egoist/poi/master)](https://circleci.com/gh/egoist/poi/tree/master) [![npm downloads](https://badgen.net/npm/dm/poi)](https://npm.im/poi) [![poi twitter](https://badgen.net/badge//@poi__js/1da1f2?icon=twitter)](https://twitter.com/poi__js)

Poi is a bundler built on the top of webpack, trying to make developing and bundling apps with webpack as easy as possible.

**The Poi project is supported by our [Backers](./BACKERS.md) and funded through [Patreon](https://patreon.com/egoist).**

## Features

- 📦 Out of box support for JS, CSS, File assets and more.
- ⚛ Framework-agnostic but also support JSX, Vue and more with no configs.
- 🔌 Great extensibility.
- 🐙 Fits most web apps, npm libs.
- 🚨 Great development experience.

## Quick Overview

Before we get started, ensure that you have installed Node.js (>=8) and Yarn (or npm) on your machine.

### Get Started Immediately

```bash
yarn global add create-poi-app
create-poi-app my-app

cd my-app
npm run dev
```

Then open http://localhost:4000 to see your app.

When you’re ready to deploy to production, create a minified bundle with `npm run build`.

### Get Started Manually

Inside an empty project, run `yarn init` or `npm init` to create a `package.json` and install Poi:

```bash
yarn init
yarn add poi --dev
```

Now all you need is to create an entry file, like if you're building a website, just create an `index.js`:

```js
const el = document.createElement('div')
el.textContent = 'Hello Poi!'

document.body.appendChild(el)
```

Now if you run:

```bash
yarn poi --serve
```

You will get a URL like `http://localhost:4000` which you can open to preview the app.

Next let's start adding some dependencies like a CSS file `style.module.css`:

```css
.title {
color: pink;
}
```

```js
import styles from './style.module.css'

const el = document.createElement('div')
el.className = styles.title
el.textContent = 'Hello Poi!'

document.body.appendChild(el)
```

Save it and the browser will automatically reload to apply the changes!

## Documentation

📚 https://poi.js.org

You can improve it by sending pull requests to [this repository](https://github.com/poi-bundler/website).

Check out [this repository](https://github.com/poi-bundler/examples) for more examples.

## Community

All feedback and suggestions are welcome!

- 💬 Join the community on [Spectrum](https://spectrum.chat/poi).
- 📣 Stay up to date on new features and announcements on [Twitter @poi\_\_js](https://twitter.com/poi__js).

## Credits

Poi v12 wouldn't exist without the inspirations from following projects:

- Webpack
- Parcel 2
- Poi itself
- Vue CLI 3
- Create React App

## License

MIT © [EGOIST](https://egoist.sh)