Vue에서 jquery와 bootstrap 전역으로 사용하기

expose-loader의 설치가 필요 없는 방법을 사용해보자

Vuejs-kr에 좋은 내용이 있지만 웹팩을 통해 jquery를 꺼내는 방법이 더 간단하다.

설치

1
$ yarn add jquery bootstrap

설정

webpack

build/webpack.base.conf.js
1
2
3
4
5
6
7
8
9
10
11
12
const webpack = require('webpack');

module.exports = {
plugins: [
new webpack.ProvidePlugin({
$: 'jquery',
jquery: 'jquery',
'window.jQuery': 'jquery',
jQuery: 'jquery',
}),
],
};

eslint

.enlintrs.js
1
2
3
4
5
6
module.exports = {
globals: {
$: true,
jQuery: true,
},
};

연동

src/main.js
1
2
3
import 'bootstrap'

new Vue({...})