Have you heard about React? Check it out if you haven't.
Here's a quick configuration to add Babel, a JavaScript compiler, to your Grunt process.
With the following you will transform your .jsx files to .js that will browser will understand and process.
Enjoy.
package.json
"name": "XXX",
"version": "1.0.0",
"description": "XXXXXXX",
"devDependencies": {
......
"grunt-babel": ">= 6.0.0",
"babel-plugin-transform-react-jsx": ">= 6.3",
"babel-preset-es2015": ">= 6.3",
"babel-preset-react": ">= 6.3"
}
}
Code language: JavaScript (javascript)
Gruntfile.js
babel: {
options: {
plugins: ['transform-react-jsx'],
presets: ['es2015', 'react']
},
jsx: {
files: [{
expand: true,
cwd: 'source/js/jsx/', // Custom folder
src: ['*.jsx'],
dest: 'source/js/jsx-compiled/', // Custom folder
ext: '.js'
}]
}
}
Code language: CSS (css)