The build config file is located at
[root]/tools/themes/metronic/[version_package].conf.json/[version_package].json
and you can fully customize the build settings to meet your project requirements:
Check the dist output path config.dist
for the build tools to output the compilation.
{
"config": {
"demo": "",
"debug": false,
"compile": {
"rtl": {
"enabled": true,
"skip" : [
"select2",
"socicon",
"line-awesome",
"flaticon",
"metronic",
"fontawesome5",
"jstree",
"owl.carousel",
"fullcalendar",
"bootstrap-datepicker",
"bootstrap-datetime-picker",
"bootstrap-switch",
"nouislider"
]
},
"jsUglify": false,
"cssMinify": false,
"jsSourcemaps": false,
"cssSourcemaps": false
},
"path": {
"src": "./../themes/themes/metronic/src",
"node_modules": "./node_modules",
"demo_api_url": "https://keenthemes.com/metronic/preview/"
},
"dist": [
"./../themes/themes/metronic/dist/preview/assets",
"./../themes/themes/metronic/dist/default/**/assets",
"./../themes/themes/metronic/dist/classic/assets"
]
},
"build": {
"vendors": {
"base": {
"src": {
"mandatory": {
"jquery": {
"scripts": [
"{$config.path.node_modules}/jquery/dist/jquery.js"
]
},
"popper.js": {
"scripts": [
"{$config.path.node_modules}/popper.js/dist/umd/popper.js"
]
},
"bootstrap": {
"scripts": [
"{$config.path.node_modules}/bootstrap/dist/js/bootstrap.min.js"
]
},
"js-cookie": {
"scripts": [
"{$config.path.node_modules}/js-cookie/src/js.cookie.js"
]
},
"moment": {
"scripts": [
"{$config.path.node_modules}/moment/min/moment.min.js"
]
},
"tooltip.js": {
"scripts": [
"{$config.path.node_modules}/tooltip.js/dist/umd/tooltip.min.js"
]
},
"perfect-scrollbar": {
"styles": [
"{$config.path.node_modules}/perfect-scrollbar/css/perfect-scrollbar.css"
],
"scripts": [
"{$config.path.node_modules}/perfect-scrollbar/dist/perfect-scrollbar.js"
]
},
"wnumb": {
"scripts": [
"{$config.path.node_modules}/wnumb/wNumb.js"
]
}
},
"optional": {
"jquery.repeater": {
"scripts": [
"{$config.path.node_modules}/jquery.repeater/src/intro.js",
"{$config.path.node_modules}/jquery.repeater/src/lib.js",
"{$config.path.node_modules}/jquery.repeater/src/jquery.input.js",
"{$config.path.node_modules}/jquery.repeater/src/repeater.js",
"{$config.path.node_modules}/jquery.repeater/src/outro.js"
]
},
"jquery-form": {
"scripts": [
"{$config.path.node_modules}/jquery-form/dist/jquery.form.min.js"
]
},
"tether": {
"styles": [
"{$config.path.node_modules}/tether/dist/css/tether.css"
],
"scripts": []
},
"block-ui": {
"scripts": [
"{$config.path.node_modules}/block-ui/jquery.blockUI.js"
]
},
"bootstrap-datepicker": {
"styles": [
"{$config.path.node_modules}/bootstrap-datepicker/dist/css/bootstrap-datepicker3.min.css"
],
"scripts": [
"{$config.path.node_modules}/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js",
"{$config.path.src}/js/framework/components/plugins/forms/bootstrap-datepicker.init.js"
]
},
"bootstrap-datetime-picker": {
"styles": [
"{$config.path.node_modules}/bootstrap-datetime-picker/css/bootstrap-datetimepicker.min.css"
],
"scripts": [
"{$config.path.node_modules}/bootstrap-datetime-picker/js/bootstrap-datetimepicker.min.js"
]
},
"bootstrap-timepicker": {
"styles": [
"{$config.path.node_modules}/bootstrap-timepicker/css/bootstrap-timepicker.min.css"
],
"scripts": [
"{$config.path.node_modules}/bootstrap-timepicker/js/bootstrap-timepicker.min.js",
"{$config.path.src}/js/framework/components/plugins/forms/bootstrap-timepicker.init.js"
]
},
"bootstrap-daterangepicker": {
"styles": [
"{$config.path.node_modules}/bootstrap-daterangepicker/daterangepicker.css"
],
"scripts": [
"{$config.path.node_modules}/bootstrap-daterangepicker/daterangepicker.js",
"{$config.path.src}/js/framework/components/plugins/forms/bootstrap-daterangepicker.init.js"
]
},
"bootstrap-touchspin": {
"styles": [
"{$config.path.node_modules}/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.css"
],
"scripts": [
"{$config.path.node_modules}/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.js"
]
},
"bootstrap-maxlength": {
"scripts": [
"{$config.path.node_modules}/bootstrap-maxlength/src/bootstrap-maxlength.js"
]
},
"bootstrap-switch": {
"styles": [
"{$config.path.node_modules}/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css"
],
"scripts": [
"{$config.path.node_modules}/bootstrap-switch/dist/js/bootstrap-switch.js",
"{$config.path.src}/js/framework/components/plugins/forms/bootstrap-switch.init.js"
]
},
"bootstrap-multiselectsplitter": {
"scripts": [
"{$config.path.src}/vendors/bootstrap-multiselectsplitter/bootstrap-multiselectsplitter.min.js"
]
},
"bootstrap-select": {
"styles": [
"{$config.path.node_modules}/bootstrap-select/dist/css/bootstrap-select.css"
],
"scripts": [
"{$config.path.node_modules}/bootstrap-select/dist/js/bootstrap-select.js"
]
},
"select2": {
"styles": [
"{$config.path.node_modules}/select2/dist/css/select2.css"
],
"scripts": [
"{$config.path.node_modules}/select2/dist/js/select2.full.js"
]
},
"typeahead.js": {
"scripts": [
"{$config.path.node_modules}/typeahead.js/dist/typeahead.bundle.js",
"{$config.path.node_modules}/handlebars/dist/handlebars.js"
]
},
"inputmask": {
"scripts": [
"{$config.path.node_modules}/inputmask/dist/jquery.inputmask.bundle.js",
"{$config.path.node_modules}/inputmask/dist/inputmask/inputmask.date.extensions.js",
"{$config.path.node_modules}/inputmask/dist/inputmask/inputmask.numeric.extensions.js",
"{$config.path.node_modules}/inputmask/dist/inputmask/inputmask.phone.extensions.js"
]
},
"nouislider": {
"styles": [
"{$config.path.node_modules}/nouislider/distribute/nouislider.css"
],
"scripts": [
"{$config.path.node_modules}/nouislider/distribute/nouislider.js"
]
},
"owl.carousel": {
"styles": [
"{$config.path.node_modules}/owl.carousel/dist/assets/owl.carousel.css",
"{$config.path.node_modules}/owl.carousel/dist/assets/owl.theme.default.css"
],
"scripts": [
"{$config.path.node_modules}/owl.carousel/dist/owl.carousel.js"
],
"images": [
"{$config.path.node_modules}/owl.carousel/dist/assets/owl.video.play.png",
"{$config.path.node_modules}/owl.carousel/dist/assets/ajax-loader.gif"
]
},
"autosize": {
"scripts": [
"{$config.path.node_modules}/autosize/dist/autosize.js"
]
},
"clipboard": {
"scripts": [
"{$config.path.node_modules}/clipboard/dist/clipboard.min.js"
]
},
"ion-rangeslider": {
"styles": [
"{$config.path.node_modules}/ion-rangeslider/css/ion.rangeSlider.css",
"{$config.path.node_modules}/ion-rangeslider/css/ion.rangeSlider.skinFlat.css"
],
"scripts": [
"{$config.path.node_modules}/ion-rangeslider/js/ion.rangeSlider.js"
],
"images": [
"{$config.path.node_modules}/ion-rangeslider/img/sprite-skin-flat.png"
]
},
"dropzone": {
"styles": [
"{$config.path.node_modules}/dropzone/dist/dropzone.css"
],
"scripts": [
"{$config.path.node_modules}/dropzone/dist/dropzone.js"
]
},
"summernote": {
"styles": [
"{$config.path.node_modules}/summernote/dist/summernote.css"
],
"scripts": [
"{$config.path.node_modules}/summernote/dist/summernote.js"
],
"fonts": [
"{$config.path.node_modules}/summernote/dist/font/**"
]
},
"bootstrap-makrdown": {
"styles": [
"{$config.path.node_modules}/bootstrap-markdown/css/bootstrap-markdown.min.css"
],
"scripts": [
"{$config.path.node_modules}/markdown/lib/markdown.js",
"{$config.path.node_modules}/bootstrap-markdown/js/bootstrap-markdown.js",
"{$config.path.src}/js/framework/components/plugins/forms/bootstrap-markdown.init.js"
]
},
"jquery-validation": {
"scripts": [
"{$config.path.node_modules}/jquery-validation/dist/jquery.validate.js",
"{$config.path.node_modules}/jquery-validation/dist/additional-methods.js",
"{$config.path.src}/js/framework/components/plugins/forms/jquery-validation.init.js"
]
},
"remarkable-bootstrap-notify": {
"scripts": [
"{$config.path.node_modules}/bootstrap-notify/bootstrap-notify.min.js",
"{$config.path.src}/js/framework/components/plugins/base/bootstrap-notify.init.js"
]
},
"animate.css": {
"styles": [
"{$config.path.node_modules}/animate.css/animate.min.css"
]
},
"toastr": {
"styles": [
"{$config.path.node_modules}/toastr/build/toastr.css"
],
"scripts": [
"{$config.path.node_modules}/toastr/build/toastr.min.js"
]
},
"jstree": {
"styles": [
"{$config.path.node_modules}/jstree/dist/themes/default/style.css"
],
"scripts": [
"{$config.path.node_modules}/jstree/dist/jstree.js"
],
"images": [
"{$config.path.src}/vendors/jstree/32px.png",
"{$config.path.node_modules}/jstree/dist/themes/default/40px.png",
"{$config.path.node_modules}/jstree/dist/themes/default/*.gif"
]
},
"morris.js": {
"styles": [
"{$config.path.node_modules}/morris.js/morris.css"
],
"scripts": [
"{$config.path.node_modules}/raphael/raphael.js",
"{$config.path.node_modules}/morris.js/morris.js"
]
},
"chartist": {
"styles": [
"{$config.path.node_modules}/chartist/dist/chartist.min.css"
],
"scripts": [
"{$config.path.node_modules}/chartist/dist/chartist.js"
]
},
"chart.js": {
"scripts": [
"{$config.path.node_modules}/chart.js/dist/Chart.bundle.js",
"{$config.path.src}/js/framework/components/plugins/charts/chart.init.js"
]
},
"bootstrap-session-timeout": {
"scripts": [
"{$config.path.src}/vendors/bootstrap-session-timeout/dist/bootstrap-session-timeout.min.js"
]
},
"jquery-idletimer": {
"scripts": [
"{$config.path.src}/vendors/jquery-idletimer/idle-timer.min.js"
]
},
"counterup": {
"scripts": [
"{$config.path.node_modules}/waypoints/lib/jquery.waypoints.js",
"{$config.path.node_modules}/counterup/jquery.counterup.js"
]
},
"sweetalert2": {
"styles": [
"{$config.path.node_modules}/sweetalert2/dist/sweetalert2.min.css"
],
"scripts": [
"{$config.path.node_modules}/es6-promise-polyfill/promise.min.js",
"{$config.path.node_modules}/sweetalert2/dist/sweetalert2.min.js",
"{$config.path.src}/js/framework/components/plugins/base/sweetalert2.init.js"
]
},
"socicon": {
"styles": [
"{$config.path.node_modules}/socicon/css/socicon.css"
],
"fonts": [
"{$config.path.node_modules}/socicon/font/**"
]
},
"line-awesome": {
"styles": [
"{$config.path.src}/vendors/line-awesome/css/line-awesome.css"
],
"fonts": [
"{$config.path.src}/vendors/line-awesome/fonts/**"
]
},
"flaticon": {
"styles": [
"{$config.path.src}/vendors/flaticon/css/flaticon.css"
],
"fonts": [
"{$config.path.src}/vendors/flaticon/fonts/**"
]
},
"metronic": {
"styles": [
"{$config.path.src}/vendors/metronic/css/styles.css"
],
"fonts": [
"{$config.path.src}/vendors/metronic/fonts/**"
]
},
"fontawesome5": {
"styles": [
"{$config.path.src}/vendors/fontawesome5/web-fonts-with-css/css/fontawesome-all.min.css"
],
"fonts": [
"{$config.path.src}/vendors/fontawesome5/web-fonts-with-css/webfonts/**"
]
}
}
},
"bundle": {
"styles": "{$config.output}/vendors/base/vendors.bundle.css",
"scripts": "{$config.output}/vendors/base/vendors.bundle.js",
"images": "{$config.output}/vendors/base/images",
"fonts": "{$config.output}/vendors/base/fonts"
}
},
"custom": {
"jquery-ui": {
"src": {
"styles": [
"{$config.path.src}/vendors/jquery-ui/jquery-ui.min.css"
],
"scripts": [
"{$config.path.src}/vendors/jquery-ui/jquery-ui.min.js"
],
"images": [
"{$config.path.src}/vendors/jquery-ui/images/*"
]
},
"bundle": {
"styles": "{$config.output}/vendors/custom/jquery-ui/jquery-ui.bundle.css",
"scripts": "{$config.output}/vendors/custom/jquery-ui/jquery-ui.bundle.js",
"images": "{$config.output}/vendors/custom/jquery-ui/images"
}
},
"fullcalendar": {
"src": {
"styles": [
"{$config.path.node_modules}/fullcalendar/dist/fullcalendar.css"
],
"scripts": [
"{$config.path.node_modules}/fullcalendar/dist/fullcalendar.js",
"{$config.path.node_modules}/fullcalendar/dist/gcal.js"
]
},
"bundle": {
"styles": "{$config.output}/vendors/custom/fullcalendar/fullcalendar.bundle.css",
"scripts": "{$config.output}/vendors/custom/fullcalendar/fullcalendar.bundle.js"
}
},
"gmaps": {
"src": {
"scripts": [
"{$config.path.node_modules}/gmaps/gmaps.js"
]
},
"bundle": {
"scripts": "{$config.output}/vendors/custom/gmaps/gmaps.js"
}
},
"jqvmap": {
"src": {
"styles": [
"{$config.path.node_modules}/jqvmap/dist/jqvmap.css"
],
"scripts": [
"{$config.path.node_modules}/jqvmap/dist/jquery.vmap.js",
"{$config.path.node_modules}/jqvmap/dist/maps/jquery.vmap.europe.js",
"{$config.path.node_modules}/jqvmap/dist/maps/jquery.vmap.germany.js",
"{$config.path.node_modules}/jqvmap/dist/maps/jquery.vmap.russia.js",
"{$config.path.node_modules}/jqvmap/dist/maps/jquery.vmap.usa.js",
"{$config.path.node_modules}/jqvmap/dist/maps/jquery.vmap.world.js"
]
},
"bundle": {
"styles": "{$config.output}/vendors/custom/jqvmap/jqvmap.bundle.css",
"scripts": "{$config.output}/vendors/custom/jqvmap/jqvmap.bundle.js"
}
},
"jquery-flot": {
"src": {
"scripts": [
"{$config.path.node_modules}/jquery-flot/jquery.flot.js",
"{$config.path.node_modules}/jquery-flot/jquery.flot.resize.js",
"{$config.path.node_modules}/jquery-flot/jquery.flot.categories.js",
"{$config.path.node_modules}/jquery-flot/jquery.flot.pie.js",
"{$config.path.node_modules}/jquery-flot/jquery.flot.stack.js",
"{$config.path.node_modules}/jquery-flot/jquery.flot.crosshair.js",
"{$config.path.node_modules}/jquery-flot/jquery.flot.axislabels.js"
]
},
"bundle": {
"scripts": "{$config.output}/vendors/custom/flot/flot.bundle.js"
}
},
"datatables.net": {
"src": {
"styles": [
"{$config.path.node_modules}/datatables.net-bs4/css/dataTables.bootstrap4.css",
"{$config.path.node_modules}/datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-autofill-bs4/css/autoFill.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-colreorder-bs4/css/colReorder.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-fixedcolumns-bs4/css/fixedColumns.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-fixedheader-bs4/css/fixedHeader.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-keytable-bs4/css/keyTable.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-rowgroup-bs4/css/rowGroup.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-rowreorder-bs4/css/rowReorder.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-scroller-bs4/css/scroller.bootstrap4.min.css",
"{$config.path.node_modules}/datatables.net-select-bs4/css/select.bootstrap4.min.css"
],
"scripts": [
"{$config.path.node_modules}/datatables.net/js/jquery.dataTables.js",
"{$config.path.node_modules}/datatables.net-bs4/js/dataTables.bootstrap4.js",
"{$config.path.src}/js/framework/components/plugins/misc/datatables.init.js",
"{$config.path.node_modules}/datatables.net-autofill/js/dataTables.autoFill.min.js",
"{$config.path.node_modules}/datatables.net-autofill-bs4/js/autoFill.bootstrap4.min.js",
"{$config.path.node_modules}/jszip/dist/jszip.min.js",
"{$config.path.node_modules}/pdfmake/build/pdfmake.min.js",
"{$config.path.node_modules}/pdfmake/build/vfs_fonts.js",
"{$config.path.node_modules}/datatables.net-buttons/js/dataTables.buttons.min.js",
"{$config.path.node_modules}/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js",
"{$config.path.node_modules}/datatables.net-buttons/js/buttons.colVis.js",
"{$config.path.node_modules}/datatables.net-buttons/js/buttons.flash.js",
"{$config.path.node_modules}/datatables.net-buttons/js/buttons.html5.js",
"{$config.path.node_modules}/datatables.net-buttons/js/buttons.print.js",
"{$config.path.node_modules}/datatables.net-colreorder/js/dataTables.colReorder.min.js",
"{$config.path.node_modules}/datatables.net-fixedcolumns/js/dataTables.fixedColumns.min.js",
"{$config.path.node_modules}/datatables.net-fixedheader/js/dataTables.fixedHeader.min.js",
"{$config.path.node_modules}/datatables.net-keytable/js/dataTables.keyTable.min.js",
"{$config.path.node_modules}/datatables.net-responsive/js/dataTables.responsive.min.js",
"{$config.path.node_modules}/datatables.net-responsive-bs4/js/responsive.bootstrap4.min.js",
"{$config.path.node_modules}/datatables.net-rowgroup/js/dataTables.rowGroup.min.js",
"{$config.path.node_modules}/datatables.net-rowreorder/js/dataTables.rowReorder.min.js",
"{$config.path.node_modules}/datatables.net-scroller/js/dataTables.scroller.min.js",
"{$config.path.node_modules}/datatables.net-select/js/dataTables.select.min.js"
]
},
"bundle": {
"styles": "{$config.output}/vendors/custom/datatables/datatables.bundle.css",
"scripts": "{$config.output}/vendors/custom/datatables/datatables.bundle.js"
}
}
}
},
"demo": {
"default": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/default/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/plugins/misc/mdatatable.init.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/default/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/default/base/style.bundle.css",
"scripts": "{$config.output}/demo/default/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/default/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/default/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/default/custom/",
"media": "{$config.output}/demo/default/media/"
}
}
},
"demo2": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo2/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo2/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo2/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo2/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo2/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo2/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo2/custom/",
"media": "{$config.output}/demo/demo2/media/"
}
}
},
"demo3": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo3/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo3/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo3/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo3/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo3/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo3/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo3/custom/",
"media": "{$config.output}/demo/demo3/media/"
}
}
},
"demo4": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo4/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo4/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo4/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo4/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo4/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo4/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo4/custom/",
"media": "{$config.output}/demo/demo4/media/"
}
}
},
"demo5": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo5/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo5/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo5/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo5/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo5/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo5/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo5/custom/",
"media": "{$config.output}/demo/demo5/media/"
}
}
},
"demo6": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo6/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo6/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo6/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo6/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo6/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo6/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo6/custom/",
"media": "{$config.output}/demo/demo6/media/"
}
}
},
"demo7": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo7/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo7/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo7/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo7/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo7/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo7/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo7/custom/",
"media": "{$config.output}/demo/demo7/media/"
}
}
},
"demo8": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo8/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo8/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo8/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo8/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo8/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo8/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo8/custom/",
"media": "{$config.output}/demo/demo8/media/"
}
}
},
"demo9": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo9/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo9/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo9/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo9/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo9/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo9/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo9/custom/",
"media": "{$config.output}/demo/demo9/media/"
}
}
},
"demo10": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo10/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo10/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo10/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo10/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo10/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo10/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo10/custom/",
"media": "{$config.output}/demo/demo10/media/"
}
}
},
"demo11": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo11/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo11/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo11/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo11/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo11/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo11/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo11/custom/",
"media": "{$config.output}/demo/demo11/media/"
}
}
},
"demo12": {
"base": {
"src": {
"styles": [
"{$config.path.src}/sass/demo/demo12/style.scss"
],
"scripts": [
"{$config.path.src}/js/framework/base/util.js",
"{$config.path.src}/js/framework/base/app.js",
"{$config.path.src}/js/framework/components/general/datatable/datatable.js",
"{$config.path.src}/js/framework/components/general/**/*.js",
"{$config.path.src}/js/demo/demo12/base/**/*.js",
"{$config.path.src}/js/app/base/**/*.js",
"{$config.path.src}/js/snippets/base/**/*.js"
]
},
"bundle": {
"styles": "{$config.output}/demo/demo12/base/style.bundle.css",
"scripts": "{$config.output}/demo/demo12/base/scripts.bundle.js"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/demo/demo12/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/demo/demo12/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/demo/demo12/custom/",
"media": "{$config.output}/demo/demo12/media/"
}
}
}
},
"snippets": {
"apps": {
"src": {
"scripts": [
"{$config.path.src}/js/snippets/apps/**/*.js"
]
},
"output": {
"scripts": "{$config.output}/snippets/apps"
}
},
"custom": {
"src": {
"scripts": [
"{$config.path.src}/js/snippets/custom/**/*.js"
]
},
"output": {
"scripts": "{$config.output}/snippets/custom"
}
}
},
"app": {
"src": {
"scripts": [
"{$config.path.src}/js/app/custom/**/*.js"
],
"media": [
"{$config.path.src}/media/app/**/*.*"
]
},
"output": {
"scripts": "{$config.output}/app/js",
"media": "{$config.output}/app/media"
}
}
}
}
Required Core CSS and JS files
Vendors list under build.vendors.base.src.mandatory
is required, and the
build.vendors.base.src.optional
is optional. Also JS & CSS files in
build.demo.[demo_id]*
is required for specific demo styles and scripts.
*[demo_id]
is the unique demo name, like default, demo2, demo3, etc.
Under snippets
and app
nodes are for preview demo and optional plugins.
Build Config |
Field |
Type |
Description |
config.demo |
string |
Specify an ID of the selected demo for gulp tool to build assets only for selected demo |
config.debug |
boolean |
Enable/disable debug console log. |
config.compile.rtl.enabled |
boolean |
Enable/disable compilation with RTL version of CSS along with default LTR CSS. |
config.compile.rtl.skip |
array |
An array of plugin to be skipped from being compile as RTL. |
config.compile.jsUglify |
boolean |
Enable/disable output Javascript minify. |
config.compile.cssMinify |
boolean |
Enable/disable output CSS minify. |
config.compile.jsSourcemaps |
boolean |
Enable/disable output Javascript with sourcemaps. |
config.compile.cssSourcemaps |
boolean |
Enable/disable output CSS with sourcemaps. |
config.path |
object |
Predefined paths the where src/ , node_modules/ and
theme/[root]/src/ are located.
demo_api_url is the ajax API path used by datatables, dropdowns with live search and other json server side data source related demos.
|
config.dist |
object |
dist stands for
distributable and refers to the directories where the minified and bundled assets will be stored for production uses.
|
Build Items |
build.vendors |
object |
vendors object specifies all 3rd party resources to be deployed to
assets/vendors/ folder for production usage
|
build.vendors.base |
object |
This object specifies global 3rd party resources to be added into the base css and js vendors bundles
assets/vendors/base/vendors.bundle.js and
assets/vendors/base/vendors.bundle.css
The 3rd party plugin images or font files also will be deployed into
assets/vendors/base/images and
assets/vendors/base/fonts
|
build.vendors.custom |
object |
This object specifies 3rd party resources that are includable on demand from
assets/vendors/custom/ folder
|
build.demo.default |
object |
Default demo assets
|
build.demo.default.base |
object |
This object specifies the global assets of the demo to be added into the base css and js demo bundles
assets/demo/default/base/scripts.bundle.js
and assets/demo/default/base/styles.bundle.css
The media(e.g: images) of the demo are deployed into
assets/demo/default/media
|
build.demo.default.custom |
object |
This object specifies custom assets that are includable on demand from
assets/demo/default/custom/ folder
|
build.snippets |
object |
This object specifies snippets assets that are includable on demand from
assets/snippets/ folder
|
build.app |
object |
This object specifies application level global assets that are includable on demand from
assets/app/ folder.
Useful if you want to add custom scripts that are used in some spesific pages only.
|
Gulp can run automatically when a file changed. Watch tasks file is located in [root]/tools/gulp/watch.js
.
To run watcher for all JS and CSS files. Run command below.
You also can run watcher separately for JS and CSS.