Running Angular app with beefy

Posted by Andrey Marushkevych on December 16, 2014

Just discovered beefy - great way to run your browserify app for development.

Very pleasant surprise is that beefy will replace any not existing resource with default index.html - great for single page apps. And it works great for angular apps with html5Mode enabled. So, instead of using cumbersome regexp in connect modRewrite, you can run your app with beefy:

beefy js/app.js:dist/bundle.js --index=index.html

We are telling beefy to dynamically bundle our app starting from js/app.js, and use this bundle whenever <script src="/dist/bundle.js"></script> is requested. Also we telling beefy to use index.html whenever un-existing asset is requested - this will take care of browser refreshes and direct navigation with html5Mode.

Another advantage is that it “will spit compile errors out into the browser so you don’t have that 1-2 seconds of cognitive dissonance and profound ennui that follows refreshing the page only to get a blank screen.”

You can add scripts entry in your package.js to run beefy with npm start:

 "scripts": {
    "start": "beefy app/js/app.js:dist/bundle.js --index=app/index.html --cwd ./app"
  }


blog comments powered by Disqus