美文网首页我爱编程
vue中引入jQuery和bootstrap

vue中引入jQuery和bootstrap

作者: changlinwang | 来源:发表于2017-06-26 10:19 被阅读985次

    一、引入jQuery:

    在当前的Vue项目中运行,运行命令npm install jquery –save-dev 这样就将jquery安装到了这个项目中。

    然后修改webpack.base.conf.js两个地方:

    其一:加入var webpack = require(“webpack”);

    其二:在module.exports的里面加入

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

    加到最后就好。

    最后在main.js中加入import $ from ‘jquery’ 完成jQuery的引入。

    二、引入 bootstrap.css文件:

    同样在vue项目中运行 npm install bootstrap –save-dev

    修改webpack.base.conf.js

    resolve: {
    extensions: [‘.js’, ‘.vue’, ‘.json’],
    alias: {
    ‘vue$’: ‘vue/dist/vue.esm.js’,
    ‘@’: resolve(‘src’),
    ‘bootstrap’:resolve(‘src/assets/bootstrap’), //如果是自己手动导入的话需要加这一句,如果是 npm install bootstrap –save的话不需要写这个
    }
    },

    在main.js中import引入

    import ‘bootstrap/js/bootstrap.min.js’
    import ‘bootstrap/css/bootstrap.min.css’

    http://www.cnblogs.com/haimishasha/p/6556410.html

    相关文章

      网友评论

        本文标题:vue中引入jQuery和bootstrap

        本文链接:https://www.haomeiwen.com/subject/gsudcxtx.html