MERN >> Transform jsx to js with babel
1. npm install --save-dev babel-cli babel-preset-react
// --save-dev: just for development, not installed in production
2. node_modules/.bin/babel src --presets react --out-dir static
// Transform
3. In package.json add 2 commands compile and watch:
"scripts": {
"compile": "babel src –presets react –out-dir static",
"watch": "babel src –presets react –out-dir static –watch"
},
=> npm run compile OR npm run watch
4. Transfrom JS ES5 to ES2015
npm install –save-dev babel-preset-es2015
"scripts": {
"compile": "babel src --presets react,es2015 --out-dir static",
"watch": "babel src --presets react,es2015 --out-dir static --watch",
}
5. Add polyfill to index.html to use built-in functions in ES2015
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.13.0/polyfill.js">
</script>