|
| 1 | +--- |
| 2 | +layout: post |
| 3 | +excerpt: Using plugins with UI-Router 1.0 for AngularJS |
| 4 | +comments: true |
| 5 | +permalink: /blog/:title/ |
| 6 | +--- |
| 7 | + |
| 8 | +This post describes how to use plugins when using UI-Router 1.0 for AngularJS and `<script>` tags. |
| 9 | + |
| 10 | +### UI-Router Core |
| 11 | + |
| 12 | +The `angular-ui-router` has been the defacto standard for routing in AngularJS. |
| 13 | +However, over the years UI-Router has undergone some significant transformations. |
| 14 | + |
| 15 | +The core of the library has been refactored into its [own library, `@uirouter/core`](https://github.com/ui-router/core). |
| 16 | +This core library has been used to create new routers for |
| 17 | +[React](https://github.com/ui-router/react), |
| 18 | +[It's Just Angular (2.x+)](https://github.com/ui-router/angular), |
| 19 | +[Polymer](https://github.com/ergo/polymer-ui-router), and even |
| 20 | +[Backbone/Marionette](https://github.com/bobmanary/ui-router-marionette). |
| 21 | + |
| 22 | + |
| 23 | +### Plugins and UMD bundles |
| 24 | + |
| 25 | +When UI-Router for AngularJS 1.0 was released, we split the bundles into `ui-router-core.js` and `ui-router-angularjs.js`. |
| 26 | +This was necessary to support plugins which depend only on the framework-agnostic `ui-router-core.js`. |
| 27 | +Note: we also [renamed our NPM packages to scoped package names](/blog/uirouter-scoped-packages/). |
| 28 | + |
| 29 | +Users who formerly included only `angular-ui-router.js` should now include both bundles. |
| 30 | +Add [`ui-router-core.js`](https://unpkg.com/@uirouter/core/_bundles/) from the [`@uirouter/core` package](https://github.com/ui-router/core) |
| 31 | +as well as [`ui-router-angularjs.js`](https://unpkg.com/@uirouter/[email protected]/release/) from the [`@uirouter/angularjs` package ](https://github.com/angular-ui/ui-router). |
| 32 | + |
| 33 | +### Backwards compatibility mono-bundle |
| 34 | + |
| 35 | +For backwards compatibility reasons, we will continue to publish a monolithic bundle as [`angular-ui-router.js`](https://unpkg.com/@uirouter/angularjs/release/). |
| 36 | +This bundle includes *both the core and angularjs code*. |
| 37 | +However, this bundle is not compatible with many UI-Router plugins which depend on `@uirouter/core`. |
| 38 | + |
| 39 | +### Webpack users |
| 40 | + |
| 41 | +Users of webpack (or any bundlers which use node module resolution) should not need to make any changes because of UMD bundles. |
| 42 | +Simply `require` or `import` from the [scoped package](/blog/uirouter-scoped-packages/) `@uirouter/angularjs` instead of from `angular-ui-router`. |
0 commit comments