Search code examples
javascriptgulpaurelia

How a deployed aurelia web application differs than an application that runs locally on gulp


Is there an article that describes how a deployed aurelia web application differs than an application that runs locally on gulp. This must be a general question that applies not only to aurelia. There is a js library that I'm using that hangs the browser. That never happens when I run the app locally which makes me think that there is something really different that the deployed app does not have.


Solution

  • You are correct, this is not so much Aurelia specific, but build-tool specific. When you run your app locally, you will be using npm dependencies that are installed in /node_modules directory and resources from local file system (like CSS, images etc). When you bundle your application for deployment you need to bundle everything needed to run the app (including dependencies and resources).

    For every bundler you can configure what to bundle and create different bundles. There are good explanations on how to bundle for both Aurelia CLI project (bundle configuration is in aurelia_project/aurelia.json) and JSPM project (bundle configuration is in bundle.js).

    Just make sure that all necessary files and modules are bundled. Often the problem is not with bundling itself, but stuff that cannot be bundled. There are some very stubborn libraries (eg some assets of Bootstrap or some jQuery-based plugins) that will not work when bundled. Then you need to include them in deployment separately. In JSPM configuration it means you will have to export them together with bundles. Export basicly means "select all files that will be used to run the app in production" and those files are going to be copied to /export directory in case of JSPM. In CLI installation you will need to add copyFiles section to aurelia.json to export extra files.

    Check this article on how bundling exactly works and this one to understand what is the role of aurelia-bundler in the process (hint: aurelia-bundler is a part of framework that creates ready-to-use Gulp tasks for you).