在 Vue-cli 中使用 bootstrap

bootstrap

  • 安装
    npm i -D bootstrap jquery

  • eslint

需要在eslint 的规则中加入 jQuery, 否则 eslint 会报错, $ undefined

  env: {
      "browser": true,
      "jquery": true
  },
  • webpack.base.conf.js
const webpack = require('webpack')
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
      'jquery': "jquery"  
    }
  },
  plugins: [
    new webpack.ProvidePlugin({
      $: "jquery",
      jQuery: "jquery",
      "window.jQuery": "jquery"
    })
  ]
  • main.js
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'

你可能感兴趣的:(在 Vue-cli 中使用 bootstrap)