Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ef4/ember-root-url
A template helper to keep your URLs relative to the app's rootURL.
https://github.com/ef4/ember-root-url
Last synced: 23 days ago
JSON representation
A template helper to keep your URLs relative to the app's rootURL.
- Host: GitHub
- URL: https://github.com/ef4/ember-root-url
- Owner: ef4
- License: mit
- Created: 2018-03-29T17:46:49.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2022-01-25T20:45:00.000Z (almost 3 years ago)
- Last Synced: 2024-10-19T18:08:48.176Z (24 days ago)
- Language: JavaScript
- Size: 330 KB
- Stars: 10
- Watchers: 3
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.md
Awesome Lists containing this project
- awesome-ember - ember-root-url - A template helper to keep your URLs relative to the app's rootURL. (Packages / Helpers)
README
ember-root-url
==============================================================================
This addon provides the `root-url` helper:
```hbs
```
It's purpose is to make it easy to express a URL relative to your application's rootURL.
Explanation
------------------------------------------------------------------------------
Because Ember apps handle their own routing, they need to know their own rootURL. This is configured in your `config/environment.js`.
If your app includes some assets, those assets will also be available under the rootURL.
If you want a portable way to refer to those assets, you need to construct their URLs relative to rootURL. Otherwise the links can break if you deploy your app under a new rootURL.
Compatibility
------------------------------------------------------------------------------
* Ember.js v3.12 or above
* Ember CLI v3.12 or above
* Node.js v12 or above
Installation
------------------------------------------------------------------------------
```
ember install ember-root-url
```
Usage
------------------------------------------------------------------------------
If you have an image in your app's `public/images/hello.png`, you can link to it like:
```hbs
```
Assuming you are using the default `rootURL` of `/`, it will render like:
```hbs
```
And if you have a customized rootURL of "/my-app", it will render like
```hbs
```
Of course it's fine to pass any value, it doesn't need to be a literal:
```hbs
```
You can also build root-relative URLs in JavaScript using `service:root-url`:
```js
export default MyComponent extends Component {
rootUrl: service(),
@computed
get helloUrl() {
return this.rootUrl.build('images/hello.png')
}
}
```
Contributing
------------------------------------------------------------------------------
See the [Contributing](CONTRIBUTING.md) guide for details.
License
------------------------------------------------------------------------------
This project is licensed under the [MIT License](LICENSE.md).