I have a grunt tasks to concat and minify all my javascript files into one single file and the javascript file is in dist folder. "dist/<%= pkg.name %>.min.js'"
"Gruntfile.js"
module.exports = function (grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON("package.json"),
concat: {
options: {
separator: ';'
},
dist: {
src: ['src/main/resources/app/js/**/*.js',
'src/main/resources/app/config/*.js',
'src/main/resources/app/app/js'],
dest: 'dist/<%= pkg.name %>.js'
}
},
uglify: {
options: {
banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'
},
dist: {
files: {
'src/main/resources/app/dist/<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.registerTask("default", ["concat", "uglify"]);
};
Now, how can I use this minified version of javscript? Moreover, my index.html entry point of my code points to the non-minified version.
"index.html"
<div ui-view/>
<script data-main="config/require-conf" src="vendor/requirejs/require.js"></script>
You could use usemin from https://www.npmjs.com/package/grunt-usemin . Usemin, with other tasks as
is able to minify all js and css in one single file. You only need to add a build:js as you can see in snippet below:
<!-- build:js SCLogic.min.js --> <!-- Load app main script --> <script src="app/app.js"></script> <!-- Load services --> <script src="app/services/authInterceptorService.js"></script> <script src="app/services/authService.js"></script> <script src="app/services/blablaService.js"></script> <!-- Load controllers --> <script src="app/controllers/indexController.js"></script> <script src="app/controllers/homeController.js"></script> <script src="app/controllers/loginController.js"></script> <script src="app/controllers/blablaController.js"></script> <script src="app/directives/validNumber.js"></script> <script src="app/controllers/angular-locale_es-es.js"></script> <!-- endbuild -->
You can just include the js file the normal way.
<script src="path to the minified file"></script>
in your index.html. Minified file is just like a normal JS file. What it does is:
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.