码迷,mamicode.com
首页 > Web开发 > 详细

vue-cli项目中单文件组件引入bootstrap.js异常的解决方案

时间:2018-03-31 20:37:46      阅读:488      评论:0      收藏:0      [点我收藏+]

标签:var   ase   win   path   efi   ack   javascrip   引入   ons   

0.修改webpack.base.conf.js

 1 var webpack = require ("webpack") //add
 2 
 3 //...
 4 
 5 module.exports = {
 6   resolve: {
 7     extensions: [‘.js‘, ‘.vue‘, ‘.json‘],
 8     alias: {
 9       ‘vue$‘: ‘vue/dist/vue.esm.js‘,
10       ‘@‘: resolve(‘src‘),
11       ‘jquery‘ : ‘jquery‘ //add
12     }
13   },
14   // add
15   plugins : [
16     new webpack.ProvidePlugin ({
17       // 将jquery及其别名注册到全局
18       $ : "jquery" ,
19       jQuery : "jquery",
20       ‘window.jQuery‘ : ‘jquery‘ ,
21       // 将Popper及其别名注册到全局
22       Popper : [‘popper.js‘ , ‘default‘]
23     })
24   ] 
25 //...
26 }

1.修改bootstrap源码

 1 (function (global, factory) {
 2     typeof exports === ‘object‘ && typeof module !== ‘undefined‘ ? factory(exports, require(‘jquery‘), require(‘popper.js‘)) :
 3     typeof define === ‘function‘ && define.amd ? define([‘exports‘, ‘jquery‘, ‘popper.js‘], factory) :
 4     (factory((global.bootstrap = {}),global.jQuery,global.Popper));
 5 }(
 6   window , // 此参数原本为this,改为window
 7   (function (exports,$,Popper) { ‘use strict‘;
 8 
 9 $ = $ && $.hasOwnProperty(‘default‘) ? $[‘default‘] : $;
10 Popper = Popper && Popper.hasOwnProperty(‘default‘) ? Popper[‘default‘] : Popper;
11 //...
12 }))) ;

2.在单文件组件(.vue)或main.js中引入bootstrap.js

import ‘/the/path/of/bootstrap.js‘

3.END  

vue-cli项目中单文件组件引入bootstrap.js异常的解决方案

标签:var   ase   win   path   efi   ack   javascrip   引入   ons   

原文地址:https://www.cnblogs.com/maoguy/p/8683819.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!