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
> Babel is a compiler for writing next generation JavaScript.
7
5
8
-
This package allows transpiling JavaScript files using [Babel](https://github.com/babel/babel) and [webpack](https://github.com/webpack/webpack).
__Notes:__ Issues with the output should be reported on the babel [issue tracker](https://github.com/babel/babel/issues);
16
+
This package allows transpiling JavaScript files using [Babel](https://github.com/babel/babel) and [webpack](https://github.com/webpack/webpack).
11
17
12
-
## Installation
18
+
__Notes:__ Issues with the output should be reported on the babel [issue tracker](https://github.com/babel/babel/issues);
__Note:__[npm](https://npmjs.com) deprecated [auto-installing of peerDependencies](https://github.com/npm/npm/issues/6565) since npm@3, so required peer dependencies like babel-core and webpack must be listed explicitly in your `package.json`.
30
+
We recommend using yarn, but you can also still use npm:
25
31
26
-
__Note:__ If you're upgrading from babel 5 to babel 6, please take a look [at this guide](https://medium.com/@malyw/how-to-update-babel-5-x-6-x-d828c230ec53#.yqxukuzdk).
> Be aware that this only works in webpack 1 and not in version 2.
91
-
92
-
```javascript
93
-
module: {
94
-
loaders: [
95
-
{
96
-
test:/\.js$/,
97
-
exclude:/(node_modules|bower_components)/,
98
-
loader:'babel-loader'
99
-
}
100
-
]
101
-
},
102
-
babel: {
103
-
presets: ['es2015']
104
-
}
105
-
```
106
-
107
-
This loader also supports the following loader-specific option:
82
+
```
108
83
109
-
*`cacheDirectory`: Default `false`. When set, the given directory will be used to cache the results of the loader. Future webpack builds will attempt to read from the cache to avoid needing to run the potentially expensive Babel recompilation process on each run. If the value is blank (`loader: 'babel-loader?cacheDirectory'`) or `true` (`loader: babel-loader?cacheDirectory=true`) the loader will use the default cache directory in `node_modules/.cache/babel-loader` or fallback to the default OS temporary file directory if no `node_modules` folder could be found in any root directory.
84
+
This loader also supports the following loader-specific option:
110
85
111
-
*`cacheIdentifier`: Default is a string composed by the babel-core's version, the babel-loader's version, the contents of .babelrc file if it exists and the value of the environment variable `BABEL_ENV` with a fallback to the `NODE_ENV` environment variable. This can be set to a custom value to force cache busting if the identifier changes.
86
+
*`cacheDirectory`: Default `false`. When set, the given directory will be used to cache the results of the loader. Future webpack builds will attempt to read from the cache to avoid needing to run the potentially expensive Babel recompilation process on each run. If the value is blank (`loader: 'babel-loader?cacheDirectory'`) or `true` (`loader: babel-loader?cacheDirectory=true`) the loader will use the default cache directory in `node_modules/.cache/babel-loader` or fallback to the default OS temporary file directory if no `node_modules` folder could be found in any root directory.
112
87
113
-
*`babelrc`: Default `true`. When `false`, will ignore `.babelrc` files (except those referenced by the `extends` option).
88
+
*`cacheIdentifier`: Default is a string composed by the babel-core's version, the babel-loader's version, the contents of .babelrc file if it exists and the value of the environment variable `BABEL_ENV` with a fallback to the `NODE_ENV` environment variable. This can be set to a custom value to force cache busting if the identifier changes.
114
89
115
-
*`forceEnv`: Default will resolve BABEL_ENV then NODE_ENV. Allow you to override BABEL_ENV/NODE_ENV at the loader level. Useful for isomorphic applications with different babel configuration for client and server.
90
+
*`forceEnv`: Default will resolve BABEL_ENV then NODE_ENV. Allow you to override BABEL_ENV/NODE_ENV at the loader level. Useful for isomorphic applications with different babel configuration for client and server.
116
91
117
-
__Note:__ The `sourceMap` option is ignored, instead sourceMaps are automatically enabled when webpack is configured to use them (via the `devtool` config option).
92
+
__Note:__ The `sourceMap` option is ignored, instead sourceMaps are automatically enabled when webpack is configured to use them (via the `devtool` config option).
118
93
119
94
## Troubleshooting
120
95
121
96
### babel-loader is slow!
122
97
123
-
Make sure you are transforming as few files as possible. Because you are probably
124
-
matching `/\.js$/`, you might be transforming the `node_modules` folder or other unwanted
125
-
source.
98
+
Make sure you are transforming as few files as possible. Because you are probably
99
+
matching `/\.js$/`, you might be transforming the `node_modules` folder or other unwanted
100
+
source.
126
101
127
-
To exclude `node_modules`, see the `exclude` option in the `loaders` config as documented above.
102
+
To exclude `node_modules`, see the `exclude` option in the `loaders` config as documented above.
128
103
129
-
You can also speed up babel-loader by as much as 2x by using the `cacheDirectory` option.
130
-
This will cache transformations to the filesystem.
104
+
You can also speed up babel-loader by as much as 2x by using the `cacheDirectory` option.
105
+
This will cache transformations to the filesystem.
131
106
132
107
### babel is injecting helpers into each file and bloating my code!
133
108
134
-
babel uses very small helpers for common functions such as `_extend`. By default
135
-
this will be added to every file that requires it.
109
+
babel uses very small helpers for common functions such as `_extend`. By default
110
+
this will be added to every file that requires it.
136
111
137
-
You can instead require the babel runtime as a separate module to avoid the duplication.
112
+
You can instead require the babel runtime as a separate module to avoid the duplication.
138
113
139
-
The following configuration disables automatic per-file runtime injection in babel, instead
140
-
requiring `babel-plugin-transform-runtime` and making all helper references use it.
114
+
The following configuration disables automatic per-file runtime injection in babel, instead
115
+
requiring `babel-plugin-transform-runtime` and making all helper references use it.
141
116
142
-
See the [docs](http://babeljs.io/docs/plugins/transform-runtime/) for more information.
117
+
See the [docs](http://babeljs.io/docs/plugins/transform-runtime/) for more information.
143
118
144
-
**NOTE:** You must run `npm install babel-plugin-transform-runtime --save-dev` to include this in your project and `babel-runtime` itself as a dependency with `npm install babel-runtime --save`.
119
+
**NOTE:** You must run `npm install babel-plugin-transform-runtime --save-dev` to include this in your project and `babel-runtime` itself as a dependency with `npm install babel-runtime --save`.
145
120
146
121
```javascript
147
-
loaders: [
122
+
rules: [
148
123
// the 'transform-runtime' plugin tells babel to require the runtime
0 commit comments