• Friday , 14 December 2018

Getting Started With Vue CLI and Bootstrap + jQuery

Code Canyon
https://i.ytimg.com/vi/HxWSL0Pvhw8/hqdefault.jpg



Vue.js is a great library and framework. How do you get it working with jQuery and Boostrap? In this video we take a look at adding external libraries like bootstrap and jQuery to a Vue.js application. We’ll also look at how to get started with Vue.js.

Are you a beginner web developer? Check out these courses below!

The Web Developer Bootcamp – http://bit.ly/2zP4alw
JavaScript: Understanding the Weird Parts – http://bit.ly/2le84Ba

My Ember.js Cookbook! http://goo.gl/B3cOZT

Find me here

http://www.facebook.com/programwitherik
http://www.programwitherik.com

Original source

3d Ocean

Related Posts

23 Comments

  1. Andrey Buchnev
    October 3, 2018 at 11:27

    Great video! Thanks for your help!

  2. Exteravol Dexsireses
    October 3, 2018 at 11:27

    Erik-Sama,
    Which one is better for a large scale project.
    "Getting Started With Vue CLI and Bootstrap + jQuery"
    or
    "Quick Tip – How To Split A Vue.js Component Into Three Files" (https://www.youtube.com/watch?v=rzel4E1JGsE)

  3. JB Dom
    October 3, 2018 at 11:27

    Excellent

  4. JB Dom
    October 3, 2018 at 11:27

    Excellent, and very well explained, a few days ago I spent a lot of time trying to do this. Thank you so much.

  5. Yasin Yildiz
    October 3, 2018 at 11:27

    Great Video thank you Erik 🙂

  6. kiran dev
    October 3, 2018 at 11:27

    I am actually digital artist Houdini and Maya are my things when I started watching this video I got kernel panic. Lol should I learn JavaScript before Vue or react js.

  7. Fyllipe David
    October 3, 2018 at 11:27

    Meu amigo, muito obrigado pela ajuda, vc não tem idéia do tamanho do problema que solucionou pra mim.
    Muito, Muito Obrigado
    [EN:
    My friend, thank you very much for the help, you have no idea the size of the problem that solved for me.
    Thank you so much
    ]

  8. follow wind
    October 3, 2018 at 11:27

    Thank you, very helpful

  9. brigz
    October 3, 2018 at 11:27

    What does the global do in global.jQuery? is it native to javascript?

  10. 日本人
    October 3, 2018 at 11:27

    good,im from china,even you is chinese,pretty good.

  11. Ƙåŋåđę Shan
    October 3, 2018 at 11:27

    me mentiste no funciona!!!!!

  12. JLucRob
    October 3, 2018 at 11:27

    Hello everyone!
    Just a note: If you want your custom component styles to override the Bootstrap styles once the project is built, you need to import Bootstrap before your Vue and App components.
    So your code would be like this:
    let Bootstrap = require('bootstrap')
    import 'bootstrap/dist/css/bootstrap.css'
    import Vue from 'vue'
    import App from './App'

  13. das web
    October 3, 2018 at 11:27

    What's your thoughts on using something like: https://bootstrap-vue.js.org/docs ?

  14. Raymart Osido
    October 3, 2018 at 11:27

    is this acceptable for creating a big projects? using jQuery on vueJs?

  15. JI Diaz
    October 3, 2018 at 11:27

    you should show your webpack.config.js file

  16. Bhushan Nikhar
    October 3, 2018 at 11:27

    plugins: [
    new webpack.ProvidePlugin({
    $: "jquery",
    jQuery: "jquery",
    "window.jQuery": "jquery"
    })
    ],

  17. Mostafa Kawsar Live
    October 3, 2018 at 11:27

    global.$ = JQuery not working

  18. Phil Gee
    October 3, 2018 at 11:27

    exactly what i needed. thank you

  19. danielsarc
    October 3, 2018 at 11:27

    Hi Erik,

    Im trying to implement a VueJs project with Foundation 6.
    This setup may work for my project.

    I think its better to not use JQuery at all and rather write the logic/animations in VueJs but bad luck for me
    I was told to use some Foundation 6 plugins for this project.

    I have been following "VueJs 2 The complete Guide" on Udemy and it has been quite a long
    but amazing journey.

    Thanks for the info,
    I hope you do a video setting up VueJs with Sass!

  20. Levaneng
    October 3, 2018 at 11:27

    Thanks for tutorial, this is exactly what I was looking for

  21. Don Puerto
    October 3, 2018 at 11:27

    Hey mate, i tried Boostrap 4, but its not working… Any idea?

  22. Gagandeep Sharma
    October 3, 2018 at 11:27

    This way you are increasing the size of bundled js file generate by vue. So, is this a really good pratice?

  23. Fabián Alejandro Pallares
    October 3, 2018 at 11:27

    Hi…

    ERROR in ./~/bootstrap/dist/css/bootstrap.css
    Module parse failed: /home/fabian/go/src/fabianpallares/proyectos/contratos/webvuejs/node_modules/bootstrap/dist/css/bootstrap.css Unexpected token (7:5)
    You may need an appropriate loader to handle this file type.
    | */
    | /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
    | html {
    | font-family: sans-serif;
    | -webkit-text-size-adjust: 100%;
    @ ./src/main.js 7:0-42
    @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

    ??

    THX.

Leave A Comment

You must be logged in to post a comment.