解决vue-cli4 bootstarp 出现error ‘$‘ is defined but never used no-unused-vars问题

想在 vue 中用一下 bootstarp 的响应式框架，结果 jquery 一直导不进来，网上教程都不全，一直给我报了很多错误，给我整蒙了一晚上，特此记录！！

1.首先一定要在项目的根目录下面 npm

2.下载 jquery

npm install jquery --save-dev

3.也是在项目的根目录下面创建vue.config.js

参考第一张图片的 vue.config.js 位置。

const webpack = require("webpack");
module.exports = {
    // 基本路径
    publicPath: './',
    configureWebpack: {
        //支持 jquery
        plugins: [
            new webpack.ProvidePlugin({
                $:"jquery",
                jQuery:"jquery",
                "windows.jQuery":"jquery"
            })
        ]
    },
}

4、package.json 中 eslint 配置项 env 中添加”jquery”:true

"jquery": true

5.还是在 page.json 中，第一个大括号的“rules”里面加入下面的代码

 注意：是在第一个大括号。

"rules": {
      "generator-star-spacing": "off",
      "no-tabs":"off",
      "no-unused-vars":"off",
      "no-console":"off",
      "no-irregular-whitespace":"off",
      "no-debugger": "off"
}

6、随便找一个 vue 界面调用，验证是否安装成功

$(function () {alert (123);});

到这一步就解决了导入不了 jQuery 的问题！

7.最后导入 bootstarp

npm install bootstrap --save-dev

指定版本用：

npm install bootstrap@3 --save-dev

最后在 main.js 里面添加：

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

到这里我们就可以在自己的项目中使用 bootstarp 的响应式框架啦。

以上关于解决vue-cli4 bootstarp 出现error ‘$‘ is defined but never used no-unused-vars问题的文章就介绍到这了，更多相关内容请搜索码云笔记以前的文章或继续浏览下面的相关文章，希望大家以后多多支持码云笔记。