Topic: Gulp Tutorial
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Open
Specification of the issue
- User: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
demzl25 pro premium priority commented 7 years ago
Hi this was helpful for me! As you have noticed – our Gulp tutorial isn’t ready yet, but I’ll try to help you with the customization of your package. Please take a look at your Gulp package. In gulpfile.js you’ll find the tasks that you need. Now let’s say we don’t want to use Material Select. Material Select is made by two files: scss and js. To remove it you need to make few steps: 1. Remove scss 1.1. Navigate to scss directory and open “mdb.scss” file. Locate and uncomment/remove the line that says: “@import “pro/material-select”;” 1.2. In your console type gulp css-compile to turn the scss code to native CSS 1.3. Type gulp css-minify to “refresh” your mdb.min.css file 2. Remove js 1.1. Go to js directory and open a file named “modules.js” 1.2. Locate './js/dist/material-select.js', and remove it 1.3. Run gulp js-build to build custom mdb.js file without Material Select 1.4. Minify the file using gulp js-minify Bonus Our gulp package includes one “bonus” task that you can use to compile your ES6 modules to JavaScript that will be understandable to your browser. For example, we’ll change the offset of scrolling navbar Please go to js/src/scrolling-navbar.js and change the constant “OFFSET_TOP” to any value you want. Then recompile your modules using npm run js-compile-plugins. Now in the js/dist/scrolling-navbar.js, you should see that your component has changed. Now you can re-build your mdb.js file. Just reminding: 1. gulp js-build 2. gulp js-minify I hope this helps