I'm trying to use babel to pile file that contains es6 promises. I have installed babel-cli, babel-preset-es2015, babel-plugin-es6-promise.
My .babelrc config is:
{
"presets": ["es2015"],
"plugins": ["es6-promise"]
}
I got piled js file with require() inside, but i don't want to use require at all.
Is there any possibility of using es6 promises today on frontend side without require js?
Please provide any link to es6 promises implementation sample with babel (or even with babel + require because i can't get require js working as well)
ps: Don't wan't to use webpack.
I'm trying to use babel to pile file that contains es6 promises. I have installed babel-cli, babel-preset-es2015, babel-plugin-es6-promise.
My .babelrc config is:
{
"presets": ["es2015"],
"plugins": ["es6-promise"]
}
I got piled js file with require() inside, but i don't want to use require at all.
Is there any possibility of using es6 promises today on frontend side without require js?
Please provide any link to es6 promises implementation sample with babel (or even with babel + require because i can't get require js working as well)
ps: Don't wan't to use webpack.
Share Improve this question edited Aug 26, 2016 at 12:38 IronAces 1,8931 gold badge28 silver badges37 bronze badges asked Aug 26, 2016 at 11:28 RantievRantiev 2,2633 gold badges38 silver badges59 bronze badges 1-
If all you want is just to use
es6-promise
and not the es6 syntax, then you can use this polyfill github./stefanpenner/es6-promise just like any other promise library. But if you want some alternatives towebpack
then you may want to tryrollup
orbrowserify
. – kabirbaidhya Commented Aug 26, 2016 at 12:40
3 Answers
Reset to default 5Is there any possibility of using es6 promises today on frontend side without require js?
In the latest Chrome/Firefox/Safari/Edge, Promises are already supported natively.
If you're looking for an older browser support as well, an easy way without Babel is to just use a polyfill library.
Here are libraries that have the exact behavior specified by the spec:
- es6-promise
- Native Promises Only
And here are some with additional customized behavior:
- BlueBird
- Q
Of course, the above are just some more popular ones but there are many others you can find by researching.
If you do want to use other ES6 features, and especially on older browsers, you could keep adding polyfills but at that point it might be easier and more future-oriented to just use Babel and its env preset.
Please provide any link to es6 promises implementation sample with babel (or even with babel + require because i can't get require js working as well)
The babel website's setup describes how to use it in basically any environment you can think of. If webpack
is too heavy for your needs, I'd remend using gulp and here's a thorough guide on how
Babel itself is just a transpiler, it translates from ES6 to ES5, and nothing else. Since ES6 includes modules, which can be used for imports like:
import Awesome from './Awesome'
Babel will transpile that into require
statements for you, but not care about the actual requiring. Therefore you need any framework that implements the AMD style require, like Browserify or something like that. Webpack will also handle that for, so if you use Webpack + Babel, all the required code will be available and there is nothing in your way to use ES6 modules (and Promises, too) via the new import
statement.
I am using a webpack.config.js
like that:
module.exports = {
entry: ['babel-polyfill', './js/main.js'],
output: {
path: './bin/js',
filename: 'main.js',
},
devtool: 'source-map',
module: {
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
}]
}
}
and a .babelrc
like that:
{
"presets": [ "es2015", "stage-3" ],
"plugins": [
"external-helpers",
"transform-async-to-generator",
"transform-runtime"
]
}
Before I started to use Webpack, I used Gulp and browserify, to first pile and than to bundle, but the setup with webpack is much simpler, so I decided to use that…
Webpack + babel - for front. node.js 5+ version/babel-register for node.js