Vue webpack引入bootstarp

Vue webpack引入bootstarp

参考

2. 错误处理

安装

1. 执行指令 npm install jquery --save-dev

2. 打开项目build目录，向webpack.base.conf.js头添加内容
   const webpack = require(‘webpack’)
   

3. 向module.exports 添加插件

     plugins: [
    new webpack.ProvidePlugin({
      $: "jquery",
      jQuery: "jquery",
      jquery: "jquery",
      "window.jQuery": "jquery"
    })
   

   ],
   

4. 向main.js 添加 import $ from ‘jquery’

5. 启动项目测试看jQuery是否引入，会报错 ‘$’ is defined but never used
   翻译意思是 已经被定义，但是未被使用
   解决：
   1. 使用jquery
   2. .eslintrc.js文件 rules添加规则： “no-unused-vars”: ‘off’
   

6. 安装bootstrap： npm install bootstrap --save-dev

7. mian.js引入bootstrap

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

   

测试结果