vue 使用Jquery和bootstrap加elementUi加swiper插件

如果你已经创建好了Vue项目，就按照下面步骤就可以加上你要用的插件或UI组建

第一步npm install jquery --save-dev安装Jquery插件模块

第二步在build/webpack.dev.conf.js中plugins数组的最后但是在plugins数组里面加入这行代码，
    new webpack.optimize.CommonsChunkPlugin('common.js'),
    new webpack.ProvidePlugin({
        jQuery: "jquery",
        $: "jquery"
    })

第三部在mian.js文件中引入这段代码就能使用了

import $ from 'jquery'
window.jQuery = $;
window.$ = $;

第四部在要用的vue组建中引入import $ from 'jquery'就可以了

接下来引入bootstrapUI框架

第一步也是通过npm install --save-dev bootstrap安装bootstrap模块依赖

第二步在main.js中引入

import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap/dist/js/bootstrap';

然后bootstrap引入完成。

接下来引入elementUI框架

第一步cnpm install element-ui --save-dev

第二步在main.js中添加下面代码

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)

然后在你的组件添加element-UI框架代码运行就好了  

接下来vue中引入swiper插件引用方法

第一步npm install swiper --save-dev安装swiper插件依赖

第二部在main.js中引入import 'swiper/dist/css/swiper.css'

而第三部则在要使用的组建中引入import Swiper from 'swiper'然后就好了

都经过本人测试然后再写  可以用