Modify css/js links with Grunt after concatenating and minifying

Asked

Viewed 62 times

0

I’m using Grunt in my project, I can concatenate them and minify them as desired. But I need to change the links from my page to the minified files. For example:

Of:

<head>
    <script src="js/arquivo1.js"></script>
    <script src="js/arquivo2.js"></script>
    <script src="js/arquivo3.js"></script>
</head>

To: 

<head>
    <script src="js/arquivo.min.js"></script>
</head>

I wonder if there is a plugin for this (should have) and how to configure it.

EDIT

Only one page (index.html) contains the links. The other pages are linked using Angularjs. I’m also using Node.js to help with Grunt.

javascript css web-application grunt

  • Are you using Node? that head exists on each page or have a head file that is included on all pages?

  • Yes, I am using Node.js too. I have only one page with the links because I use Angularjs for Singlepage Application.

1 answer

1


There are some. I particularly use this: https://github.com/dciccale/grunt-processhtml

I like this plugin because it allows not only rename the files, but recreate blocks or remove, according to your need and even if that code is not connected with some other Grunt process.

For example:

<!-- build:remove -->
    <script type="text/javascript">
        //Algum código de teste
    </script>
<!-- /build -->

After doing the process, that code will be removed from the file.

There are several options you can see in the documentation.

Important!

Note that this process will not be linked with another (at least I do not know a method to do this), that is, after concatenating and minifying the JS file, it nay will do the process in auto html. Just as it is done for JS, it should be done for HTML.

Obs.: It is worth noting that for this technique it is recommended that you move ALL files to a new unique directory for Production so it won’t interfere with your development code.

Browser other questions tagged javascript css web-application grunt

You are not signed in. Login or sign up in order to post.