vue中使用bootstrap框架

基本介绍

bootstrap框架基于jQuery，要想使用bootstrap框架，就得先引入jQuery。

第一步，引入jQuery。

在项目的根目录下，使用命令：

npm install jquery -S

打开项目下的文件夹build中的webpack.base.conf.js文件，在文件开头添加以下代码：

var webpack = require(‘webpack’)

然后在webpack.base.conf.js文件中，找到 module.exports={}，在其中插入以下代码：

plugins: [
new webpack.optimize.CommonsChunkPlugin(‘common.js’),
new webpack.ProvidePlugin({
jQuery: “jquery”,
$: “jquery”
}) ],

添加后的结果如图：

然后在mainjs中引入jQuery

import $ from ‘jquery’

第二步 引入bootstrap框架

在项目的根目录下，输入命令：

npm install bootstrap3 -S

然后在main.js文件中引入bootstrap