Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bokub/lyo
📦 Node.js to browser - The easy way
https://github.com/bokub/lyo
babel browser browserify build compiler es5 minify module uglify
Last synced: about 1 month ago
JSON representation
📦 Node.js to browser - The easy way
- Host: GitHub
- URL: https://github.com/bokub/lyo
- Owner: bokub
- License: mit
- Archived: true
- Created: 2018-08-30T18:40:52.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2018-10-15T06:27:33.000Z (about 6 years ago)
- Last Synced: 2024-09-25T07:33:38.466Z (about 1 month ago)
- Topics: babel, browser, browserify, build, compiler, es5, minify, module, uglify
- Language: JavaScript
- Homepage:
- Size: 236 KB
- Stars: 621
- Watchers: 5
- Forks: 21
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-list - lyo - The easy way | bokub | 623 | (JavaScript)
README
> Node.js to browser - The easy way
[](https://npmjs.com/package/lyo)
[](https://travis-ci.org/bokub/lyo)
[](https://codecov.io/gh/bokub/lyo)
[](https://github.com/xojs/xo)
Lyo is the easiest way to transform Node.js modules into browser-compatible libraries.
No decision-making, no configuration needed, it just works!
Lyo uses [Browserify][browserify], [Babel][babel], [UglifyJS][uglify], and a pinch of magic ✨ so you don't have to
worry about configuration
## Install & Run
```sh
# Install globally
npm i -g lyo
# Run (on your own module)
lyo
# Run (on any npm module)
lyo get
```
Lyo will create a single `.min.js` file that you can import in a `` tag
```html
<script src="my-module.min.js">
myModule('foo');
```
## Options
Lyo is supposed to work right away, but you can force things with some options if needed.
```
$ lyo --help
Usage
$ lyo [options] Run Lyo
$ lyo init [options] Add Lyo to your project
$ lyo usage [options] Show how to use the output file
$ lyo get [options] Run Lyo on a module from npm
Options
--input -i Entry file
--output -o Output file / folder
--name -n Module name in browser
--banner -b Add a banner to the top of the bundle
Examples
$ lyo
$ lyo -i main.js
$ lyo -n runFunction
$ lyo get query-string
$ lyo -o dist/bundle.min.js
$ lyo -b 'Lyo\nLicensed under MIT'
```
## Tips
- Add a `.babelrc` file at the root of your project to [configure][babel-config] the Babel compilation step
- The bundle is supposed to run in browsers. A bundle used in a Node.js program will probably be slower than the original module
- Don't blame Lyo if it fails to compile your code. The error could come from [Browserify][browserify], [Babel][babel] or [UglifyJS][uglify]
- If you like Lyo, you will love [lyo.now.sh](https://lyo.now.sh/), an automated bot 🤖 running Lyo on npm modules of your choice
## Using Lyo on your own module
Once you've tried Lyo on your module and figured the best options to use, you should consider the following steps
### 1. Add Lyo to your project
Run `lyo init` (with options) to edit your `package.json` as follows:
- Lyo will be added to the dev dependencies
- A pre-publish script will be created (or edited) so Lyo is triggered before every `npm publish`
- If you provide options, **they will be saved as default options**
```sh
# Example with some random options
$ lyo init -i lib/main.js -n runMyModule
```
Don't forget to run `npm install` after that
### 2. Add documentation
Run `lyo usage` (with options) to show an example code snippet. You can edit and include it in your `README.md`.
```
$ lyo usage
> Edit and include the following snippet in your README.md
```
### 3. Commit and publish
Lyo will output a single file called a _bundle_, by default in a `dist` folder. You can choose to commit it, or not.
It's really up to you.
Run `npm publish`, Lyo will compile your module, and the bundle will be pushed to the npm registry with the rest of your module.
Congratulations, you're done! 💪
## Using Lyo on someone else's module
Sometimes, you stumble upon a npm module without a browser-compatible version.
No worries, just run `lyo get ` to download and compile it right away âš¡
```sh
# Compile query-string (npmjs.com/package/query-string)
$ lyo get query-string
# Compile a specific version of Joi (npmjs.com/package/joi)
$ lyo get [email protected] --name Joi
```
_____
## FAQ
#### What if I need unsupported features?
If you need features unsupported by Lyo (sourcemaps, code splitting...), your best option is not using Lyo, which is
nothing more than an all-in-one package, with automatic configuration.
However, if you think Lyo should support this feature, feel free to create a new
[issue](https://github.com/bokub/lyo/issues)!
#### Why Lyo when there are thousands of better tools doing the same thing?
Lyo's philosophy is highly inspired from [XO](https://github.com/xojs/xo), a linter that works immediately, without any
configuration. XO is just an ESLint wrapper, but it saves you the hassle of choosing ESLint rules, adding them to a
new `.eslintrc` file, installing plugins...
I use XO for almost all my projects, but I could not find any tool as simple as XO for Node.js > browser compilation.
That's why I created Lyo
#### What does Lyo mean?
Lyo is short for [lyophilization](https://en.wiktionary.org/wiki/lyophilization), a process that transforms food
into a dry and compact form
## License
MIT © [Boris K](https://github.com/bokub)
[browserify]: https://github.com/browserify/browserify
[babel]: https://github.com/babel/babel
[babel-config]: https://babeljs.io/docs/en/configuration
[uglify]: https://github.com/mishoo/UglifyJS2