4 ms·
> But seriously: use Babel. Ugh, I find this to be excruciating. So you read about some new cool technology on HTML5Rocks and you want to play around with it.
by Touche 11y ago
> But seriously: use Babel.
Ugh, I find this to be excruciating. So you read about some new cool technology on HTML5Rocks and you want to play around with it. You have to:
* npm init
* npm install babel --save
* npm install browserify/webpack/greatest-thing-ever-of-the-week --save
* npm install gulp/grunt/broccoli/other-task-runner --save
* vi (gulp/grunt/broc/other)file.js
* Write some code to build your application.
* vi myapp.js (write some code to do your thing)
* > (gulp/grunt/broc) build
* Write an html file that includes your bundled es5.
* Open it in the browser. Yay! Cool I can debug now... wait a
second I made a mistake.
* vi myapp.js and fix mistake.
* > (gulp/grunt/broc) build
* Oops I made another mistake. Better set up a watch-mode so I
don't have to keep running build.
* npm install some-watch-thing --save
* vi (gulp/grunt/broc/other)file.js
* Add your watch code
* > (gulp/grunt/broc) watch
* Yay I can finally just fucking code now.
- ajacksified 11y agoSo, one more step than normal if you want to use npm dependencies in the browser, which is what you described. If you're just playing with code, here's a simpler workflow: * npm install babel * write file.js * run `babel-node file.js` Similar to your example, the only extra step here is installing babel. If it's excruciating, install it globally and save yourself forever.
- untog 11y agoEven better, just npm install -g babel once on any machine you use. Then it's ready for any and every .js file.
- cholantesh 11y agoOurs is a .NET shop and we don't have plans to update to VS2015 in the near future. Does this workflow suggest that, in order to take advantage of Babel, we will have to install npm on all our dev machines and servers?
- Touche 11y agodev machines yes.
- Touche 11y agoWell I have to run it every time I edit a file, maybe you missed the second half of my steps, so I still need a watch mode thingy which means probably a build script like virtually everyone using Babel is doing. Regardless, vi index.html is much simpler.
- tragic 11y agoWhile I feel your pain, and have spent a stretch or two in life-sapping Grunt Hell, this is kind of a sunk cost: ie, all this setup fiddling is necessary anyway for linting, test runs and so on - not just for the new shiny. So, IMHO, you may as well stick the new shiny in before/after JSHint while you're in the (gulp|grunt|broc)file.
- Touche 11y ago> While I feel your pain, and have spent a stretch or two in life-sapping Grunt Hell, this is kind of a sunk cost: ie, all this setup fiddling is necessary anyway for linting, test runs and so on - not just for the new shiny. It's not necessary, I'm just wanting to hack at some new API I read about on the web. Assuming I need to set up a test harness, CI, and linting is putting the cart well-before the horse.
- babby 11y agoTry running a server which watches for file changes and then automatically recompiles without server restart, preferbly configured in the server instead of a CLI. I couldn't be nearly as productive with any other setup.
- anarchy8 11y agoWelcome to modern web development
- timdorr 11y agoSounds like you need Lineman: http://linemanjs.com/ http://linemanjs.com/
- sprjr 11y ago* npm init * npm i -S babel * vi file.js * first line: require('babel/register'); * Yay, now you can finally just fucking code now. Learn your tools: https://babeljs.io/docs/usage/require/ https://babeljs.io/docs/usage/require/
- Touche 11y agoI have to bundle it to run it in the browser (or use babel in the client which has an entirely different set of problems). I know these tools very well.
- sehr 11y agoYou can always just have a boilerplate ready and `gulp watch` from the start * git clone 'boilerplate' * npm i * gulp watch * Yay I can finally just fucking code now.