Use bootstrap in vue-cli project

1. Install plug-in

npm install jquery --save
npm install bootstrap --save
npm install popper.js --save

2. Configure webpack.base.conf.js

// add the top 
const WebPACK the require = ( ' WebPACK ' ) 

// in module.exports = {} The following code is added at the end 
module.exports = { 
... 
plugins: [ 
    new new webpack.ProvidePlugin ({ 
      $: " jQuery " , 
      the jQuery: " jQuery " 
    }) 
  ] 
}

3. introducing in the main.js

import $ from 'jquery'
import 'bootstrap'
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min'

4. Test jquery

// add test code file vue
 
<Script> 
$ (function () { 
  Alert ( ' ! JQuery ' ) 
}) 

Export default { 
  name: ' the App ' 
}
 </ Script>

5. Test bootstrap

<button type="button" class="btn btn-success">bootstrap测试</button>