在vue-cli2中使用bootstrap,cli3安装jq

1.安装jquery(vue-cli2)

(1)安装

npm install jquery --save-dev

(2)配置webpack.config.js  (在build文件夹下)

   ① 在头部加入如下

const webpack = require("webpack");

   ② 在module.exports 末尾加上如下

plugins: [
        new webpack.ProvidePlugin({
            jQuery: 'jquery',
            $: 'jquery'
        })
    ]

(3)在index.js 文件中引入

import $ from 'jquery'

(4)测试是否成功,需先重启---->    npm run dev

2.安装Bootstrap

(1)安装

npm install bootstrap --save-dev

(2)在index.js 文件中引入

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

(3)重新启动  ----->    npm run dev

3.安装jquery(vue-cli3)

(1)安装

npm install jquery --save-dev

(2)配置vue.config.js  (在根目录下,如果没有,直接新建)(publicPath已替代原来的'baseUrl')

let webpack = require('webpack');
module.exports = {
    publicPath : './',
    configureWebpack: {
        plugins: [
            new webpack.ProvidePlugin({
                $:"jquery",
                jQuery:"jquery",
                "windows.jQuery":"jquery"
            })
        ]
    },
    lintOnSave: undefined
};

(3)测试是否成功,需先重启---->    npm run serve

 

你可能感兴趣的:(vue.js)