# ember-browserify > ember-cli addon for easily loading CommonJS modules from npm via browserify. Latest version **1.2.2** (published 2018-03-25) · MIT license · 0 weekly downloads ## Install ```sh npm install ember-browserify pnpm add ember-browserify yarn add ember-browserify bun add ember-browserify ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 1.2.2 | | Published | 2018-03-25 | | First published | 2014-11-14 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Node | >= 0.10.0 | | Dependencies | 22 | | Unpacked size | 42.9 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 172 | | Author | Edward Faulkner | | Maintainers | asakusuma, ef4, stefanpenner | | Keywords | ember-addon | ## Links - npm: https://www.npmjs.com/package/ember-browserify - Repository: https://github.com/ef4/ember-browserify - Homepage: https://github.com/ef4/ember-browserify#readme - Issues: https://github.com/ef4/ember-browserify/issues - npm.io page: https://npm.io/package/ember-browserify ## Dependencies (22) - [rsvp](https://npm.io/package/rsvp.md) ^3.0.14 - [acorn](https://npm.io/package/acorn.md) ^5.0.3 - [debug](https://npm.io/package/debug.md) ^2.2.0 - [lodash](https://npm.io/package/lodash.md) ^4.5.1 - [mkdirp](https://npm.io/package/mkdirp.md) ^0.5.0 - [rimraf](https://npm.io/package/rimraf.md) ^2.2.8 - [fs-tree](https://npm.io/package/fs-tree.md) ^1.0.0 - [md5-hex](https://npm.io/package/md5-hex.md) ^1.3.0 - [through2](https://npm.io/package/through2.md) ^2.0.0 - [derequire](https://npm.io/package/derequire.md) ^2.0.3 - [walk-sync](https://npm.io/package/walk-sync.md) ^0.2.7 - [browserify](https://npm.io/package/browserify.md) ^13.0.0 - [quick-temp](https://npm.io/package/quick-temp.md) ^0.1.2 - [core-object](https://npm.io/package/core-object.md) ^1.1.0 - [fs-tree-diff](https://npm.io/package/fs-tree-diff.md) ^0.5.0 - [broccoli-plugin](https://npm.io/package/broccoli-plugin.md) ^1.2.1 - [symlink-or-copy](https://npm.io/package/symlink-or-copy.md) ^1.0.0 - [promise-map-series](https://npm.io/package/promise-map-series.md) ^0.2.0 - [broccoli-merge-trees](https://npm.io/package/broccoli-merge-trees.md) ^1.1.2 - [broccoli-caching-writer](https://npm.io/package/broccoli-caching-writer.md) ^3.0.3 - [ember-cli-version-checker](https://npm.io/package/ember-cli-version-checker.md) ^2.1.0 - [broccoli-kitchen-sink-helpers](https://npm.io/package/broccoli-kitchen-sink-helpers.md) ^0.3.1 ## Recent versions - 1.2.2 (latest) — 2018-03-25 - 1.2.1 — 2018-01-15 - 1.2.0 — 2017-07-11 - 1.1.14 — 2017-06-29 - 1.1.13 — 2016-09-13 - 1.1.12 — 2016-08-16 - 1.1.11 — 2016-07-13 - 1.1.10 — 2016-06-30 - 1.1.9 — 2016-05-04 - 1.1.8 — 2016-03-22 - 1.1.7 — 2016-02-24 - 1.1.6 — 2016-02-02 - 1.1.5 — 2016-02-02 - 1.1.4 — 2015-11-15 - 1.1.3 — 2015-11-14 - … 32 more at https://npm.io/package/ember-browserify/versions ## README # Ember-browserify [![Build Status](https://travis-ci.org/ef4/ember-browserify.svg)](https://travis-ci.org/ef4/ember-browserify) [![Build status](https://ci.appveyor.com/api/projects/status/v6dtl3y0vxcskp7g?svg=true)](https://ci.appveyor.com/project/ef4/ember-browserify) This is an ember-cli addon for easily loading CommonJS modules from npm via browserify. It works with ember-cli >= 0.1.3. ## Synopsis Add to your ember app: ```sh npm install --save-dev ember-browserify ``` Then `npm install` any modules you want to load into your Ember app: ```sh npm install --save-dev my-cool-module ``` Then within your app, you can import the module: ```js import MyCoolModule from "npm:my-cool-module"; ``` ## Rebuilds & Caching We're careful to only re-invoke browserify when necessary. If your set of imported modules remains stable and you aren't editing them, everything is served out of cache. If you import a new npm module or edit an already-imported one, you get automatic rebuilds. ## Configuring Browserify You can put a `browserify` key in your app's `config/environment.js` to customize the behavior: ```js browserify: { extensions: ['.coffee'], transform: [ ['caching-coffeeify', { global: true }] ] } ``` ## Known Caveats Ember-browserify __cannot__ be used with named imports e.g. `import { foo } from 'bar';` as we have no way of knowing at the time of browserifying what portions of the import are being used. ## Using ember-browserify in addons Wrapping generic npm libraries is a pretty common use case for ember addons. Unfortunately, ember-browserify installed on an addon cannot simply consume an npm dependency for the host app. This is a limitation of ember-cli. More info in [this issue](https://github.com/ef4/ember-browserify/issues/34) and [this issue](https://github.com/ef4/ember-browserify/issues/38). Try it, and you'll probably get this error: ``` Path or pattern "browserify/browserify.js" did not match any files Error: Path or pattern "browserify/browserify.js" did not match any files ``` Or you might get an error like: ``` Could not find module `npm:my-module` imported from `my-project/my-file` ``` #### The workaround To have the host app consume the npm dependency, **ember-browserify and the npm dependency must be installed in the host app** as well *AND* the **module must be imported from within the `app/` directory of the addon**. So in your app, simply npm install ember-browserify and whatever npm dependencies you need consumed by ember-browserify. Then in your addon, make sure that you're importing the modules from a file in the `app/` folder. You can also import from the `addon/` directory *IF* you've also imported the same module in the `app/` directory. This is because ember-browserify running under the host application can't detect imports in the `addon/` directory, since the `app/` directory is the only directory merged with the application tree at build. Eventually, ember-cli will be able to directly pull in npm depedencies to an ember app without the need for ember-browserify. Progress on this ember-cli feature can be tracked in [this issue ticket](https://github.com/ember-cli/ember-cli/issues/4211). --- _Source: https://npm.io/package/ember-browserify · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._