Java自学者论坛

 找回密码
 立即注册

手机号码,快捷登录

恭喜Java自学者论坛(https://www.javazxz.com)已经为数万Java学习者服务超过8年了!积累会员资料超过10000G+
成为本站VIP会员,下载本站10000G+会员资源,会员资料板块,购买链接:点击进入购买VIP会员

JAVA高级面试进阶训练营视频教程

Java架构师系统进阶VIP课程

分布式高可用全栈开发微服务教程Go语言视频零基础入门到精通Java架构师3期(课件+源码)
Java开发全终端实战租房项目视频教程SpringBoot2.X入门到高级使用教程大数据培训第六期全套视频教程深度学习(CNN RNN GAN)算法原理Java亿级流量电商系统视频教程
互联网架构师视频教程年薪50万Spark2.0从入门到精通年薪50万!人工智能学习路线教程年薪50万大数据入门到精通学习路线年薪50万机器学习入门到精通教程
仿小米商城类app和小程序视频教程深度学习数据分析基础到实战最新黑马javaEE2.1就业课程从 0到JVM实战高手教程MySQL入门到精通教程
查看: 481|回复: 0

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

[复制链接]
  • TA的每日心情
    奋斗
    4 天前
  • 签到天数: 802 天

    [LV.10]以坛为家III

    2053

    主题

    2111

    帖子

    72万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9

    积分
    726006
    发表于 2021-5-27 20:50:43 | 显示全部楼层 |阅读模式

    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  

    哎...今天够累的,签到来了1...
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    QQ|手机版|小黑屋|Java自学者论坛 ( 声明:本站文章及资料整理自互联网,用于Java自学者交流学习使用,对资料版权不负任何法律责任,若有侵权请及时联系客服屏蔽删除 )

    GMT+8, 2024-11-15 12:24 , Processed in 1.063185 second(s), 30 queries .

    Powered by Discuz! X3.4

    Copyright © 2001-2021, Tencent Cloud.

    快速回复 返回顶部 返回列表