Adding MDB to Gulp Task Automation &amp; ES6 Project

Topic: Adding MDB to Gulp Task Automation & ES6 Project

joegrotto pro asked 7 years ago

I am using the Google Web Starter Kit to build my project: https://developers.google.com/web/tools/starter-kit/ I enabled ES6 and modified the JavaScript bundle task so that it works properly, but other than that all is the same. I noticed that MDBootstrap is available through NPM and I was looking to use this package in a new project. However, I am having trouble importing it properly so I was wondering if anyone could provide guidance on how they got this working? I am using ES6 in my code and Gulp per the kit above. Right now I get 2 errors:

jQuery is not defined in mdb.min.js file
Unexpected token import in main.js (primary file in my application)

Please advise and thank you for the help in advance. Link to repo is below: https://github.com/heircompany/arc-webkit

Add comment

Mirosław Stasiak free answered 7 years ago

0 0 Best answer

Please insert min. 20 characters.

Hi,
Yes, you can use this:
It is best when you add files manually to HTML, not over the npm:
In down of the head write this

 <link href="css/bootstrap.min.css" rel="stylesheet">
 <link href="css/mdb.min.css" rel="stylesheet">

In down of the body write this

 <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
 <script type="text/javascript" src="js/popper.min.js"></script>
 <script type="text/javascript" src="js/bootstrap.min.js"></script>
 <script type="text/javascript" src="js/mdb.min.js"></script>

Do not forget to add these files to your project

Import problem is not caused by mdb.
You need to set up Gulp correctly, look in google 'gulp es6'

Regards,

joegrotto pro commented 7 years ago

Thank you for your help, I added in the files manually instead of through NPM as you suggested. I also copied all files in to the project. I'm not sure what you're referring to with looking in "google gulp es6" but I have already gotten ES6 working with Gulp. Either way, now I get an error when attempting to bundle my scripts: Error: Cannot find module './picker.js' from 'C:UsersjosepProgrammingarc-webkitappjs' GitHub Repo is updated for reference, any help you can provide is greatly appreciated.

Mirosław Stasiak free commented 7 years ago

Have you got Pro Version of MDB?

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Pro
Premium support: No
Technology: MDB jQuery
MDB Version: -
Device: -
Browser: -
OS: -
Provided sample code: No
Provided link: Yes

joegrotto

Pro User 0Support score
1Questions 0Answers 0Snippets