You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
* remove outdated libraries
* rename reference to appendix
* write how to document an addon
* change wording for sass
* fix reference --> appendix links
* fix link
* clean up the existing content
* move asset compilation into the advanced section
* remove redundant content from dependencies
* remove bower from the stylesheets
* move files around
* more cleanup, comment out unused pages
* rename tutorial to intro-tutorial
Copy file name to clipboardExpand all lines: guides/advanced-use/asset-compilation.md
+76-59
Original file line number
Diff line number
Diff line change
@@ -1,19 +1,22 @@
1
-
<!--Unedited copy of asset-compilation-->
1
+
<!--Cover very very basic Broccoli info. Link to Oli's tutorials. See the Ember Times Readers questions for a great writeup of what broccoli is-->
2
2
3
-
### Raw Assets
3
+
When working on an Ember app, sometimes you may want to customize how certain kinds of assets are handled. This is referred to as "asset compilation."
4
4
5
-
*`public/assets` vs `app/styles`
5
+
For information on stylesheets, please see the dedicated section, [Stylesheet compilation](../stylesheets/)
6
6
7
-
To add images, fonts, or other assets, place them in the `public/assets` directory. For
8
-
example, if you place `logo.png` in `public/assets/images`, you can reference it in
7
+
## Raw Assets
8
+
9
+
To include images, fonts, or other assets, place them in the `public/assets` directory.
10
+
11
+
For example, if you place `logo.png` in `public/assets/images`, you can reference it in
9
12
templates with `assets/images/logo.png` or in stylesheets with
10
13
`url('/assets/images/logo.png')`.
11
14
12
15
This functionality of Ember CLI comes from
13
16
[broccoli-asset-rev](https://github.com/rickharrison/broccoli-asset-rev). Be
14
17
sure to check out all the options and usage notes.
15
18
16
-
###JS Transpiling
19
+
## JS Transpiling
17
20
18
21
Ember CLI automatically transpiles future JavaScript (ES6/ES2015, ES2016 and beyond) into standard ES5
19
22
JavaScript that runs on every browser using [Babel JS](https://babeljs.io) with the [Ember CLI Babel](https://github.com/babel/ember-cli-babel) addon.
@@ -23,7 +26,7 @@ need to be transpiled to ES5 by **analyzing your project's browser support targe
23
26
that maps to a [browserlist](https://github.com/ai/browserslist) support rule. These are defined in your
24
27
`config/targets.js` file, which [Ember CLI generates](https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/config/targets.js) like so:
25
28
26
-
```js
29
+
```javascript
27
30
/* eslint-env node */
28
31
module.exports= {
29
32
browsers: [
@@ -43,7 +46,7 @@ simply set any of the options found [here](https://github.com/babel/babel-preset
43
46
For example, if you wanted to explicitly exclude generator function transpilation from your
As of Version 2.13, Ember CLI uses Babel 6.X for transpilation. Ember CLI versions prior to 2.13 use Babel Babel 5.X, and you can check its documentation for a comprehensive list of [all available transformations](https://github.com/babel/babel.github.io/blob/5.0.0/docs/usage/transformers/index.md) and [options](https://github.com/babel/babel.github.io/blob/5.0.0/docs/usage/options.md).
74
77
75
-
76
-
77
-
### Source Maps
78
+
## Source Maps
78
79
79
80
Ember CLI supports producing source maps for your concatenated and minified JS source files.
80
81
81
82
Source maps are configured by the EmberApp `sourcemaps` option, and
82
-
are disabled in production by default. Pass `sourcemaps: {enabled: true}` to your EmberApp constructor to enable source maps for javascript. Use the `extensions` option to add other formats, such as coffeescript and CSS: `{extensions: ['js', 'css', 'coffee']}`. JS is supported out-of-the-box. CSS is not currently supported. For other source formats (Sass, Coffee, etc) refer to their addons.
83
+
are disabled in production by default. Pass `sourcemaps: {enabled: true}` to your EmberApp constructor to enable source maps for JavaScript. Use the `extensions` option to add other formats, such as CSS: `{extensions: ['js', 'css']}`. JS is supported out-of-the-box. CSS is not currently supported. For other source formats, refer to their addons.
0 commit comments