bootstrapjs开发环境搭建

Bootstrapjs是一个web前端页面应用开发框架,其提供功能丰富的JavaScript工具集以及用户界面元素或组件的样式集,本文主要描述bootstrapjs的开发环境搭建。

图片

如上所示,使用nodejs运行时环境、使用npm包管理工具、使用npm初始化一个项目工程test2023

npm i --save-dev webpack webpack-cli  webpack-dev-server html-webpack-plugin

npm i --save bootstrap @popperjs/core

npm i --save-dev autoprefixer css-loader  postcss-loader sass sass-loader style-loader

图片

图片

如上所示,安装webpack项目工程构建工具、webpack-cli是命令行支持工具、webpack-dev-server是开发环境支持工具、html-webpack-plugin是项目工程目录构建工具、安装bootstrapjs工具集、安装bootstrapcss工具集(支持css或者sass)

webpack.config.js

图片

如上所示,设置webpack项目工程构建参数、webpack根据这些设置将源码编译输出到dist构建的目录中

src/index.html

图片

如上所示,创建项目工程的首页index.html,在单页面应用中,webpack在构建过程中将javascript、css增加到该页面中

package.json

图片

如上所示,设置npm构建打包运行项目工程的执行命令以及其他参数

图片

图片

如上所示,使用npm包管理工具运行项目工程test2023成功、在浏览器中访问项目工程test2023响应成功

图片

如上所示,使用npm包管理工具构建项目工程test2023成功,可使用dist构建的工程部署到运行时环境中

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

红队专题-Cobalt strike4.5二次开发

红队专题 招募六边形战士队员IDEA 自动换行原版CS反编译破解jar包反编译拔掉暗桩初始环境效果 stageless beacon http通信协议 过程分析上线&心跳get请求teamserver 处理请求 参考链接 招募六边形战士队员 一起学习 代码审计、安全开发、web攻防、逆向等。。。 私信联系 …

MES系统安灯管理:实时可视化生产线状态

一、MES系统安灯管理的意义: 安灯管理是指通过使用不同颜色的灯光信号来表示生产线的状态,以便生产人员能够直观地了解生产线的运行情况。MES系统安灯管理的意义在于提供一个实时可视化的工具,使制造企业能够及时发现生产线异常和潜在问题&a…

UE5中实现沿样条线创建网格体2-SplineMesh版本

我在之前的一篇文章中写过沿样条线创建网格体的方法: https://blog.csdn.net/grayrail/article/details/130453733 但该方法没有网格变形操作,就会导致每一段网格对象是无法连接的: 后来发现了SplineMesh方法可以比较好的解决这个问题&…

【K8S系列】深入解析k8s 网络插件—kube-router

序言 做一件事并不难,难的是在于坚持。坚持一下也不难,难的是坚持到底。 文章标记颜色说明: 黄色:重要标题红色:用来标记结论绿色:用来标记论点蓝色:用来标记论点 在现代容器化应用程序的世界中…

横向AlGaN/GaN基SBD结构及物理模型数据库的开发

GaN基功率器件凭借其临界电场高、电子饱和漂移速度大、热导率高等优良性能在大功率快充、充电桩、新能源汽车等领域具备广泛应用空间。为进一步助推半导体高频、高功率微电子器件的发展进程,天津赛米卡尔科技有限公司技术团队依托先进的半导体TCAD仿真平台成功开发出…

【WebService】C#搭建的标准WebService接口,在使ESB模版作为参数无法获取参数数据

一、问题说明 1.1 问题描述 使用C# 搭建WebService接口,并按照ESB平台人员的要求,将命名空间改为"http://esb.webservice",使用PostmanESB平台人员提供的入参示例进行测试时,callBussiness接口参数message始终为null。 以下是ES…

如何采集淘宝数据?淘宝采集是什么意思?

对于淘宝商家和数据分析者来说,获取淘宝数据是关键之一。本文将深入探讨如何采集淘宝数据,包括采集的含义、方法和相关注意事项。 一、淘宝采集是什么意思 淘宝采集是指通过各种技术手段和工具,从淘宝平台上抓取、提取或获取数据的过程。这…

LLMs 生成式人工智能项目生命周期备忘单Generative AI Project Lifecycle Cheat Sheet

到目前为止,在本课程中,从选择模型到微调模型,再到将其与人类偏好对齐,这一切都将在您部署应用程序之前发生。为了帮助您规划生成式AI项目生命周期的各个阶段,这个速查表提供了每个工作阶段所需的时间和精力的一些指示…

SonarQube学习笔记三:直接使用sonar-scanner扫描器

目录 1.安装Sanner扫描器2.环境变量配置3.创建项目3.1 登录并创建项目3.2 输入项目名称信息3.3 选择分析仓库类型3.4 创建令牌3.5 保存令牌(非必须)3.6 选择构建技术方案3.6.1 .Net类项目3.6.2 Java类项目 3.7 获取Sonar检查结果3.8 在页面查看检查结果或…

计算机网络——计算机网络的性能指标(下)-时延带宽积、往返时间、利用率、丢包率

目录 时延带宽积 往返时间 利用率 丢包率 时延带宽积 时延带宽积等于传播时延乘带宽。假设时延带宽积是一个圆柱体,那么传播时延就是圆柱体的长,带宽就是圆柱体的圆面面积。 若发送端连续发送数据,则在所发送的第一个比特即将到达终点时&…

回归算法全解析!一文读懂机器学习中的回归模型

目录 一、引言回归问题的重要性文章目的和结构概览 二、回归基础什么是回归问题例子: 回归与分类的区别例子: 回归问题的应用场景例子: 三、常见回归算法3.1 线性回归数学原理代码实现输出例子: 3.2 多项式回归数学原理代码实现输…

【JavaEE】文件操作

文章目录 前言什么是文件树型结构组织和目录文件路径文件类型文件权限Java中的文件操作File 类的常见属性File 类常见构造方法File 类常用方法 前言 文件是我们日常生活中使用非常广泛的,我们使用任何一个程序都离不开文件操作,这个文件不仅仅指平时可以…

Pyside6 安装和简单界面开发

Pyside6 安装和简单界面开发 Pyside6介绍Pysied6开发环境搭建Python安装Pysied6安装 Pyside6界面开发简单界面设计界面设计界面编译 编写界面初始化代码软件打包 Pyside6介绍 对于Python的GUI开发来说,Python自带的可视化编程模块的功能较弱,PySide是跨…

关于Go语言的底层,Channel

1.Channel 介绍一下Channel(有缓冲和无缓冲) Go 语言中,不要通过共享内存来通信,而要通过通信来实现内存共享。Go 的CSP(Communicating Sequential Process)并发模型,中文可以叫做通信顺序进程,是通过 gor…

Node.js 做 Web 后端的优势在哪?为什么是明智的选择?

当我们谈论构建强大的Web应用程序时,选择适当的后端技术至关重要。在如今的技术领域中,Node.js已经崭露头角,并且越来越多的开发者和企业选择将其作为首选的后端开发工具。但是,Node.js究竟有哪些优势,使得它成为众多开…

SpringBoot整合POI实现Excel文件读写操作

1.环境准备 1、导入sql脚本: create database if not exists springboot default charset utf8mb4;use springboot;create table if not exists user (id bigint(20) primary key auto_increment comment 主键id,username varchar(255) not null comment 用…

NSSCTF做题(7)

[第五空间 2021]pklovecloud 反序列化 <?php include flag.php; class pkshow { function echo_name() { return "Pk very safe^.^"; } } class acp { protected $cinder; public $neutron; …

《要么孤独 要么庸俗》 笔记

人往往比自己想象的更愚蠢 我的生存原则或意志行事原则是什么&#xff1f;尝试考察自己的生命年轮 一个明智的人不会被表面稳定现象欺骗&#xff0c;还能预测事物发展趋向 由于只能理解结果而不是原因&#xff0c;会错误的认为结果会一直持续下去 很多事情需要时间来兑现&#…

【高级语言程序设计】python函数式编程(一)

基础知识 Python函数式编程的主要内容包括以下几个方面&#xff1a; (1)函数作为一等公民&#xff1a;在函数式编程中&#xff0c;函数被视为一等公民&#xff0c;可以像其他数据类型一样被传递、赋值以及作为返回值。 (2)不可变数据&#xff1a;函数式编程鼓励使用不可变数据…

docker安装wiki

1.docker pull mediawiki 2.docker run -d --name mywiki -p 8666:80 mediawiki 访问ip:8666,就可以看到配置页面了 3.docker pull mysql docker run -d --name my-mysql -e MYSQL_ROOT_PASSWORD123456 -p 3307:3306 mysql 4.在配置页面链接ip:3307,连接数据库&#xff0c;接下…