0. Modify Webpack.base.conf.js
1 varWebpack = require ("Webpack")//Add2 3 //...4 5Module.exports = {6 Resolve: {7Extensions: ['. js ', '. Vue ', '. JSON '],8 alias: {9' vue$ ': ' Vue/dist/vue.esm.js ',Ten' @ ': Resolve (' src ')), One' jquery ': ' jquery '//Add A } - }, - //Add the plugins: [ - NewWebpack. Provideplugin ({ - //registering jquery and its aliases to the global -$: "jquery" , +jquery: "jquery", -' Window.jquery ': ' JQuery ' , + //registering the Popper and its aliases with the global APopper: [' popper.js ', ' Default '] at }) - ] - //... -}
1. Modify Bootstrap Source code
1(function(Global, factory) {2 typeofExports = = = ' object ' &&typeofModule!== ' undefined '? Factory (exports, require (' jquery '), require (' popper.js '))) :3 typeofdefine = = = ' function ' && define.amd? define ([' exports ', ' jquery ', ' popper.js '], factory):4(Factory (Global.bootstrap ={}), Global.jquery,global. Popper));5 }(6window,//This parameter is originally this, changed to window7(function(Exports,$,popper) {' Use strict ';8 9$ = $ && $.hasownproperty (' Default ')? $[' Default '] : $;TenPopper = Popper && popper.hasownproperty (' Default ')? popper[' Default ']: Popper; One //... A}))) ;
2. Introducing Bootstrap.js in a single-file component (. vue) or Main.js
Import '/the/path/of/bootstrap.js '
3.END
Solutions for introducing Bootstrap.js exceptions to single-file components in VUE-CLI projects