Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to reference minified code, but keep developing in JavaScript

Our index.html refers to about 25 javascript files. For deployment, we need to minify all of those, so we have to update our index.html references to the minified versions.

When we go back to development, we have to use a similar index.html file, but make references to non-minified javascript files. Is there a best practice way to accomplish this without having to keep two index.html files in sync, one for development and one for deployment?

like image 941
dt1000 Avatar asked Oct 21 '22 00:10

dt1000


1 Answers

The answer is Source Maps, its basically a way to reference a minified javascript file back to an un-built state.

That way you only need one index.html file referencing your minified javascript file, and the source maps will help you debug them as if they were un minified.

Here is a link that really helped me.

http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/

You could also use tools like gulp or grunt to make minifying and building the source maps easier.

like image 147
Zach Spencer Avatar answered Nov 01 '22 13:11

Zach Spencer