(已解决)引入本地bootstrap无效,bootstrap和jquery的引入

news2025/1/27 13:13:57

问题:

首先我是跟着张天宇老师下载的bootstrap文件,新建了一个css文件夹,但是这样子<link rel="stylesheet" type="text/css" src="./css/bootstrap.css">在index.html引入没有用。

解决办法:

1.把建立的css文件夹删除。

2.打开项目cmd,下载指定版本的bootstrap

npm install bootstrap@3.3.5 --save

3.下载指定版本的jquery

npm install jquery@3.6.0

4.下载完成后在package.json中可以看到下载的版本号 

 

5.在bulid文件夹下的webpack.base.conf.js文件中添加代码

var webpack = require('webpack')
//然后在module.exports加入以下代码,配置全局jquery环境
plugins: [
    new webpack.ProvidePlugin({
      $: "jquery",
      jQuery: "jquery"
    })
  ],

 

6.在main.js中引入

import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'
//不用引入什么 import $ from 'jquery' 了,因为已经全局引入了

(老师是在index.html引入<link rel="stylesheet" type="text/css" src="./css/bootstrap.css">,把这个删了不用在这里引入) 

7.之后npm run dev就可以显示出效果了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1575744.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

贪心算法|1005.K次取反后最大化的数组和

力扣题目链接 class Solution { static bool cmp(int a, int b) {return abs(a) > abs(b); } public:int largestSumAfterKNegations(vector<int>& A, int K) {sort(A.begin(), A.end(), cmp); // 第一步for (int i 0; i < A.size(); i) { // 第二步if…

DSOX3034T是德科技DSOX3034T示波器

181/2461/8938产品概述&#xff1a; 特点: 带宽:350 MHz频道:4存储深度:4 Mpts采样速率:5 GSa/s更新速率:每秒1000000个波形波形数学和FFT自动探测接口用于连接、存储设备和打印的USB主机和设备端口 触摸: 8.5英寸电容式触摸屏专为触摸界面设计 发现: 业界最快的无损波形更…

MSOLSpray:一款针对微软在线账号(AzureO365)的密码喷射与安全测试工具

关于MSOLSpray MSOLSpray是一款针对微软在线账号&#xff08;Azure/O365&#xff09;的密码喷射与安全测试工具&#xff0c;在该工具的帮助下&#xff0c;广大研究人员可以直接对目标账户执行安全检测。支持检测的内容包括目标账号凭证是否有效、账号是否启用了MFA、租户账号是…

[开源]基于SVM的时间序列预测python代码

整理了SVM的时间序列预测python代码分享给大家。记得点赞哦 #!/usr/bin/env python # coding: utf-8import numpy as np import matplotlib.pyplot as plt import pandas as pd from sklearn import preprocessing from sklearn.metrics import mean_squared_error from math i…

华为海思校园招聘-芯片-数字 IC 方向 题目分享——第九套

华为海思校园招聘-芯片-数字 IC 方向 题目分享&#xff08;有参考答案&#xff09;——第九套 部分题目分享&#xff0c;完整版获取&#xff08;WX:didadidadidida313&#xff0c;加我备注&#xff1a;CSDN huawei数字芯片题目&#xff0c;谢绝白嫖哈&#xff09; 单选 1&…

MTK i500p AIoT解决方案

一、方案概述 i500p是一款强大而高效的AIoT平台&#xff0c;专为便携式、家用或商用物联网应用而设计&#xff0c;这些应用通常需要大量的边缘计算&#xff0c;需要强大的多媒体功能和多任务操作系统。该平台集成了Arm Cortex-A73 和 Cortex-A53 的四核集群&#xff0c;工作频…

2024 Tuxera NTFS for Mac功能介绍及如何安装使用

随着科技的发展&#xff0c;我们的日常生活和工作越来越依赖于电子设备。而在这些设备中&#xff0c;Mac由于其出色的稳定性和易用性&#xff0c;成为了许多用户的首选。然而&#xff0c;尽管Mac自带的文件系统已经足够强大&#xff0c;但仍有一些用户希望获得更加高效、稳定的…

Ubuntu22.04平台编译完美解决问题“error: GLSL 4.5 is not supported.”【GLSL(OpenGL着色器语言)】

GLSL介绍 GLSL&#xff08;OpenGL着色器语言&#xff09;是用于编写OpenGL着色器程序的语言。GLSL 4.5 是 GLSL 的一个版本&#xff0c;引入了许多新的特性和改进&#xff0c;旨在提高着色器编程的灵活性和性能。GLSL 4.5 工具通常是用于编写、调试和优化 GLSL 4.5 着色器代码…

网络基础知识入门

目录 一、局域网与广域网 1、局域网 2、广域网 二、协议 1、概念 2、协议的理解 3、协议的分层 1、分层 2、OSI七层模型 三、网络传输基本流程 1、报头 2、局域网通信原理 3、跨网络传输流程 四、IP地址和MAC地址 1、IP地址 2、MAC地址 3、两者的区别 一、局域…

基于微信小程序的无中介租房系统

本基于微信小程序的无中介租房系统主要实现了房东功能模块、租客功能模块和管理员功能模块三大部分&#xff0c;系统结构图如图4-1所示。 4.3.2 数据库表设计 本基于微信小程序的无中介租房系统在开发过程中使用MySQL数据库系统进行系统数据的储存&#xff0c;以下是本系统的主…

倍讯科技Ethernet/iP转modbusTCP网关在电厂里为通信设备搭建桥梁

在电厂里&#xff0c;Ethernet/IP网关扮演着极为重要的角色&#xff0c;它作为不同设备和系统之间的通信桥梁&#xff0c;使得基于不同协议的设备能够无缝交流&#xff0c;从而实现整个电厂的高效、可靠运行。Ethernet/IP网关的使用提高了数据的实时性和可靠性&#xff0c;优化…

蓝桥杯 历届真题 杨辉三角形【第十二届】【省赛】【C组】

资源限制 内存限制&#xff1a;256.0MB C/C时间限制&#xff1a;1.0s Java时间限制&#xff1a;3.0s Python时间限制&#xff1a;5.0s 思路&#xff1a; 由于我第一写没考虑到大数据的原因&#xff0c;直接判断导致只得了40分&#xff0c;下面是我的代码&#xff1a; #…

Flutter第六弹 基础列表ListView

目标&#xff1a; 1&#xff09;Flutter有哪些常用的列表组建 2&#xff09;怎么定制列表项Item&#xff1f; 一、ListView简介 使用标准的 ListView 构造方法非常适合只有少量数据的列表。我们还将使用内置的 ListTile widget 来给我们的条目提供可视化结构。ListView支持…

一个更难破解的加密算法 Bcrypt

BCrypt是由Niels Provos和David Mazires设计的密码哈希函数&#xff0c;他是基于Blowfish密码而来的&#xff0c;并于1999年在USENIX上提出。 除了加盐来抵御rainbow table 攻击之外&#xff0c;bcrypt的一个非常重要的特征就是自适应性&#xff0c;可以保证加密的速度在一个特…

深入理解GO语言——GC垃圾回收二

文章目录 前言一、Go V1.5的三色并发标记法总结 前言 书接上回&#xff0c;无论怎么优化&#xff0c;Go V1.3都面临这个一个重要问题&#xff0c;就是mark-and-sweep 算法会暂停整个程序 。 Go是如何面对并这个问题的呢&#xff1f;接下来G V1.5版本 就用 三色并发标记法 来优…

基于SpringBoot的“垃圾分类网站”的设计与实现(源码+数据库+文档+PPT)

基于SpringBoot的“垃圾分类网站”的设计与实现&#xff08;源码数据库文档PPT) 开发语言&#xff1a;Java 数据库&#xff1a;MySQL 技术&#xff1a;SpringBoot 工具&#xff1a;IDEA/Ecilpse、Navicat、Maven 系统展示 系统功能结构图 系统功能界面图 用户登录、用户注…

stable-diffusion-webui安装教程

现在AI开始进入绘画领域,并且能自动根据文本来创建图片出来,这是一个划时代的进步。 这时候,我也不能落后,要紧跟上时代的步伐,那么也来学习一下stable-diffusion的使用,这样也算多一项对技术的认识,提高对AI的认知。 从网上看到很多stable-diffusion-webui的安装,其…

石器时代_单机版_1.0到9.0全部版本集_内附教程

一. 版本介绍图 二. 运行环境 pc单机&#xff0c;可在所有windows系统畅玩&#xff0c;内附安装教程。 三. 源码获取 https://githubs.xyz/y27.html

企业级开源路由系统VyOS-构建和使用

介绍 VyOS是一个基于Linux的企业级路由器操作系统&#xff0c;被许多公司和个人用来驱动物理网络设备&#xff0c;如路由器和防火墙。它有一个统一的命令行界面来管理其所有的网络相关功能&#xff08;和Juniper Junos操作很像&#xff09;。VyOS使用Debian GNU/Linux作为其基…

锂电池算法学习集合---基于matlab/simulink的电池参数辨识、充放电、SOC估计算法。

整理了锂电池的多种算法合集&#xff1a;涵盖电动汽车Simulink模型、电动汽车动力电池SOC估算模型、动力电池及电池管理系统BMS。 电动汽车动力电池SOC估算模型含有:电池参数辨识模型、电池的充放电数据、电池手册、卡尔曼滤波电池SOC文献、卡尔曼滤波算法的锂电池SOC估算模型…