Created
August 12, 2016 04:54
-
-
Save digitalbocca/f3ff53aeba7a4218b6cbfb642dca150a to your computer and use it in GitHub Desktop.
Formato que funcionou perfeitamente no Webpack para usar o Jquery dentro do Vue. Tudo isso para funcionar um modal do Bootstrap em um protótipo.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Importando o JQuery e Tether para o Bootstrap 4 | |
* | |
* Webpack | |
* VueJS | |
* | |
* Não use em produção. | |
* | |
* @author Gabriel Bertola Bocca <gabriel at estudiodigitalbocca.com.br> | |
* @copyright (c) 2016, Estúdio Digital Bocca | |
* @version v0.1 | |
*/ | |
import Vue from 'vue' | |
import App from './App' | |
//Dependências do bootstrap | |
window.jQuery = window.$ = require('jquery/dist/jquery.min') | |
window.Tether = require('tether/dist/js/tether.min') | |
//Bootstrap JS e CSS | |
require('bootstrap/dist/js/bootstrap.min') | |
require('bootstrap/dist/css/bootstrap.min.css') | |
/** | |
* OBS: Esta implementação corrigiu os seguintes erros: | |
* | |
* ReferenceError: assignment to undeclared variable jQuery | |
* Error: Bootstrap's JavaScript requires jQuery | |
* Error: Bootstrap tooltips require Tether (http://github.hubspot.com/tether/) | |
* | |
* Entre outros como tela branca sem mostrar nenhum erro e etc... | |
* | |
* Não sei se é a melhor forma de resolver esse problema, | |
* mas foi a única que funcionou até agora. | |
* | |
* Se souber uma solução mais "elegante", ou souber o erro que estou cometendo: Me informe. | |
* | |
* Obrigado. | |
* | |
*/ | |
new Vue({ | |
el: 'body', | |
components: { App } | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment