基于Java+SpringBoot+vue+elementui图书商城系统设计实现

news2025/2/25 8:24:27

博主介绍全网粉丝20W+,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战

🍅文末获取联系🍅精彩专栏推荐订阅👇🏻👇🏻👇🏻👇🏻

 java项目精品实战案例《100套》

Java毕业设计参考题目《值得收藏 ​》

目录

一、前言介绍:

二、系统分析:

2.1 可行性分析

2.1.1 技术可行性

2.1.2 经济可行性 

2.1.3 操作可行性

2.2 系统性能分析

2.3 系统功能需求分析

2.3.1管理员用例需求如图所示

2.3.2 用户功能需求如图所示:

​2.3.3用户登录注册时序图

2.4 系统的功能结构图

 2.5 系统数据库设计

 2.5.1 图书回收管理实体E-R图

2.5.2 回收预约管理实体E- R图

 三、功能截图: 

3.1 登录注册模块:

3.2 前端首页功能:

3.2.1 首页模块:

3.2.2 新书榜:

3.2.3 特价区:

3.2.4 旧书回收:

3.2.5 公告资讯:

3.2.6 个人中心:

3.2.7 后台管理:

3.2.8 客服管理:

3.3 后台管理模块:

3.3.1 图书分类顾客:

3.3.2 回收类型管理:

3.3.3 新书榜管理:

3.3.4 图书详情

3.3.6 用户信息管理:

3.3.7 订单模块管理:

3.3.8 系统模块管理 :

四、代码实现:

五、文档目录:

六、项目总结: 

八、源码获取:


一、前言介绍:

        随着现在网络的快速发展,网上管理系统也逐渐快速发展起来,网上管理模式很快融入到了许多商家的之中,随之就产生了“网上图书购物系统”,这样就让网上图书购物系统更加方便简单。

        对于本网上图书购物系统的设计来说,系统开发主要是采用java语言技术,在整个系统的设计中应用MySQL数据库来完成数据存储,具体根据网上图书购物系统的现状来进行开发的,具体根据现实的需求来实现网上图书购物系统网络化的管理,各类信息有序地进行存储,进入网上图书购物系统页面之后,方可开始操作主控界面,主要功能包括管理员:首页、个人中心图书分类管理回收类别管理新书榜管理特价区管理旧书回收管理、用户管理、订单评价管理、回收预约管理、图书回收管理、管理员管理、系统管理、订单管理。前台使用首页、新书榜、特价区、旧书回收、公告资讯、个人中心、后台管理、购物车、客服。用户首页、个人中心、订单评价管理、回收预约管理、图书回收管理、我的收藏管理、订单管理等功能。

        本系统主要讲述了网上图书购物系统开发背景,该系统它主要是对需求分析和功能需求做了介绍,并且对系统做了详细的测试和总结。具体从业务流程、数据库设计和系统结构等多方面的问题。望能利用先进的计算机技术和网络技术来改变目前的网上图书购物系统状况,提高管理效率。

二、系统分析:

2.1 可行性分析

        可行性分析主要是针对这个项目开发是否有意义和价值观来进行的全面分析,在分析的过程当中发现这个系统所存在的不足之处。就拿这次网上图书购物系统的设计与实现来说主要是针对一些用户在发布网上图书购物系统信息时遇到不方便的操作和问题来进行解决问题的,最后能够让网上图书购物系统开发得到最大的用处。而且对于用户方面我们可以提供给一个简单方便操作的网上图书购物系统。所以我们要计算开发这个系统它能否有效的解决好这个系统经济问题,在开发完成以后所带来的利益是否大于开发过成当中的成本。所以可行性的研究与分析是这个系统在开发和设计上是必不可缺少的一部分。从该系统文章的全部来看,我们要从以下几个方面进行分析:

技术可行性:在技术方面我们要从现有自己掌握的技术能否设计出我们当初所预定的目标。

经济可行性:在这次系统开发和设计过程当中所用的经费是否大于以后给社会带来的价值观。

操作可行性:系统在用户使用过程当中是否方便、简单,能否达到大部分的用户会使用。

2.1.1 技术可行性

        技术的可行性分析主要是针对开发该系统所用到技术进行分析,对于网上图书购物系统的设计,可以在任何一个地方都进行使用和管理。通过当前我们所学的程序开发和语言介绍利用以上的技术开发该系统是比较合适的。而且我们在使用的数据库也是要保证这个系统的完整性、数据安全性好的条件。

2.1.2 经济可行性 

        经济可行性主要是决定这个系统是否具有价值存在,是否具有开发意义,如果开发的项目不能够节约物品和资源,反而使用的大量的人力、财力和物力不成正比甚至小于投资成本,那么该项目是不具备开发意义和价值的。在开发本项目的初期,节约成本是最基本的,设计和开发都是由本人一人完成的,并且在开发中使我学习到了很多的知识,也开拓了自己的眼界,在通过可行性分析之后,该项目的利大于弊,所以该项目是具有开发意义和价值的。

2.1.3 操作可行性

        网上图书购物系统的开发登录界面它是我们最常见的一种登录窗口来完成的,用户可以使电脑来进行登录并简单的访问不需要做任何的操作。对于此次的系统开发它主要是基于B/S结构和java技术及MySQL数据库来完成,让系统开发更加完美和完善,所以我们开出的系统界面更加人性化,用户使用也更加方便。而且系统在使用过程当中也拥有方便操作、易管理等特点。

经过以上的叙述,所以开发此系统在经济上、技术上是满足开发条件的。

2.2 系统性能分析

1.如果我们想要对前后台处理的层次分明那么我们就要采用B/S模式来进行系统的开发这样就可以方便用户的使用。

2.对于系统的开发和设计我们就要采用大家日常所需要的要求,这样一来可以提高系统的适用性也能保证系统利用价值。对于一个系统来说一个好的框架是很重要的,因为一个好的框架它可以提高系统的稳定和高效性。

3.在系统界面上也要设计一个方便快捷的登录界面,这样就可以提高用户对系统操作性和适用性。

4.在系统模块设计当中我们要对系统各个模块进行合理简化和设计,这样就能提高系统使用性。

5.对于一个完整的系统来说对于它的测评和测试是比较重要的,所以我们在软件设计程序中要保持软件占用的时间和速度快的特点。

6.对于这个系统来说我们首先要考虑所设计出的系统它具有那些突破和体现,所以我们尽力去改进这个系统去适应用户

2.3 系统功能需求分析

        对于一个新的网站来说开发新网站我们就要做出这个系统的任务需求分析,因为对系统分析的质量好坏它可以决定这个网站开发的意义,俗话说得好一个好的开头是成功的一半,对于开发这个网上图书购物系统来说前期的分析是比较重要的,所以任务分析它可以决定这系统的开展和设计,这样就可以保证用户满意性。

任务的需求它能决定这个系统开发过程当中一个重要环节,所以我们在系统开发过程所用质量是比较重要的,因为我们在系统应用过程当中不一定那会出现问题,所以我们在进行对系统分析是比较重要的,因为它可以决定这个系统功能和需求。

本课题要求实现一套网上图书购物系统的开发与实现,主要实现功能包括管理员:首页、个人中心、图书分类管理、回收类别管理、新书榜管理、特价区管理、旧书回收管理、用户管理、订单评价管理、回收预约管理、图书回收管理、管理员管理、系统管理、订单管理

前台使用:首页、新书榜、特价区、旧书回收、公告资讯、个人中心、后台管理、购物车、客服

用户:首页、个人中心、订单评价管理、回收预约管理、图书回收管理、我的收藏管理、订单管理  网上图书购物系统。

2.3.1管理员用例需求如图所示

2.3.2 用户功能需求如图所示:

2.3.3用户登录注册时序图

前端用户发送登录请求-验证输入的账号虚线-执行数据查询-返回查询结果-判断用户是否存在-前端根据结果集执行不同的操作。

2.4 系统的功能结构图

        通过系统需求分析,本网上图书购物系统主要实现功能包括;管理员:首页、个人中心、图书分类管理、回收类别管理、新书榜管理、特价区管理、旧书回收管理、用户管理、订单评价管理、回收预约管理、图书回收管理、管理员管理、系统管理、订单管理。用户:首页、个人中心、订单评价管理、回收预约管理、图书回收管理、我的收藏管理、订单管理等功能。其功能结构图如下图所示。

 2.5 系统数据库设计

        在该系统的信息中,由于数据库的支持,我们可以对数据库进行收集、整理、更新和加工等操作。由于数据库的存储功能强大,所以数据库已经成为了计算机必不可少的,一个数据库的好坏直接影响该系统的质量和效率。一个系统中的数据库是必不可少的,并且起着决定性因素。通过之前的系统分析,可以规划出本系统中使用的主要等,下面设计出这几个关键实体的实体关系图。

订单管理实体E-R图如图4-2所示

 2.5.1 图书回收管理实体E-R图如图所示

2.5.2 回收预约管理实体E- R图,如图所示:

 三、功能截图: 

3.1 登录注册模块:

通过填写用户名、密码、角色等信息,输入完成后选择登录即可进入网上图书购物系统。

3.2 前端首页功能:

网上图书购物系统,在系统首页可以查看首页、新书榜、特价区、旧书回收、公告资讯、个人中心、后台管理、购物车、客服等内容。

3.2.1 首页模块:

3.2.2 新书榜:

新书榜新书榜页面可以填写图书名称、分类、标签、图片、作者、出版社、发行日期、价格等内容进行立即购买。

 图书页面,可以收藏,加入购物车,查看详情以及评论和购买等操作。

 购物车详情,可以添加数量和删除。点击购买进行模拟支付结账。

选择收货地址后点击支付下单:

 支付成功后查看物流状态信息:

3.2.3 特价区:

3.2.4 旧书回收:

查看回收详情,点击回收预约填写相关信息,完成后管理员进行审核。 

3.2.5 公告资讯:

3.2.6 个人中心:

个人中心可以查看修改个人信息,查看订单得各种状态,以及对收货地址进行查看修改和收藏进行查看。也可以收货地址页面可以填写联系人、手机号码、地址、默认等内容进行添加地址

3.2.7 后台管理:

普通用户后台管理:

3.2.8 客服管理:

可以对客服进行留言聊天。

3.3 后台管理模块:

3.3.1 图书分类顾客:

3.3.2 回收类型管理:

3.3.3 新书榜管理:

管理员对新书榜管理查看图书名称、分类、标签、图片、作者、出版社、发行日期、价格等信息进行详情、删除、修改、查看等操作。

3.3.4 图书详情

3.3.6 用户信息管理:

3.3.7 订单模块管理:

3.3.8 系统模块管理 :

四、代码实现:


/**
 * 新书榜
 * 后端接口
 * @author 
 * @email 
 * @date 2022-01-18 07:36:34
 */
@RestController
@RequestMapping("/xinshubang")
public class XinshubangController {
    @Autowired
    private XinshubangService xinshubangService;
    
    /**
     * 后端列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,XinshubangEntity xinshubang, HttpServletRequest request){

        EntityWrapper<XinshubangEntity> ew = new EntityWrapper<XinshubangEntity>();
		PageUtils page = xinshubangService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, xinshubang), params), params));
        return R.ok().put("data", page);
    }
      
	 /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(XinshubangEntity xinshubang){
        EntityWrapper< XinshubangEntity> ew = new EntityWrapper< XinshubangEntity>();
 		ew.allEq(MPUtil.allEQMapPre( xinshubang, "xinshubang")); 
		XinshubangView xinshubangView =  xinshubangService.selectView(ew);
		return R.ok("查询新书榜成功").put("data", xinshubangView);
    }
	
    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        XinshubangEntity xinshubang = xinshubangService.selectById(id);
		xinshubang.setClicknum(xinshubang.getClicknum()+1);
		xinshubang.setClicktime(new Date());
		xinshubangService.updateById(xinshubang);
        return R.ok().put("data", xinshubang);
    }

      
    /**
     * 前端保存
     */
    @RequestMapping("/add")
    public R add(@RequestBody XinshubangEntity xinshubang, HttpServletRequest request){
    	xinshubang.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(xinshubang);

        xinshubangService.insert(xinshubang);
        return R.ok();
    }

  
    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        xinshubangService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    
   	/**
     * 前端智能排序
     */
	@IgnoreAuth
    @RequestMapping("/autoSort")
    public R autoSort(@RequestParam Map<String, Object> params,XinshubangEntity xinshubang, HttpServletRequest request,String pre){
        EntityWrapper<XinshubangEntity> ew = new EntityWrapper<XinshubangEntity>();
        Map<String, Object> newMap = new HashMap<String, Object>();
        Map<String, Object> param = new HashMap<String, Object>();
		Iterator<Map.Entry<String, Object>> it = param.entrySet().iterator();
		while (it.hasNext()) {
			Map.Entry<String, Object> entry = it.next();
			String key = entry.getKey();
			String newKey = entry.getKey();
			if (pre.endsWith(".")) {
				newMap.put(pre + newKey, entry.getValue());
			} else if (StringUtils.isEmpty(pre)) {
				newMap.put(newKey, entry.getValue());
			} else {
				newMap.put(pre + "." + newKey, entry.getValue());
			}
		}
		params.put("sort", "clicknum");
        
        params.put("order", "desc");
		PageUtils page = xinshubangService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, xinshubang), params), params));
        return R.ok().put("data", page);
    }


}
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<title>新书榜</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="stylesheet" href="../../layui/css/layui.css">
<link rel="stylesheet" href="../../xznstatic/css/common.css"/>
<link rel="stylesheet" href="../../xznstatic/css/style.css"/>
<script type="text/javascript" src="../../xznstatic/js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="../../xznstatic/js/jquery.SuperSlide.2.1.1.js"></script>
</head>																																																																																													</div>
	   		<div class="pager" id="pager" :style="{textAlign:1==1?'left':1==2?'center':'right'}"></div>
	  </div>
	</div
  </div>
  <script src="../../layui/layui.js"></script>
  <script src="../../js/vue.js"></script>
  <script src="../../js/config.js"></script>
  <script src="../../modules/config.js"></script>
  <script src="../../js/utils.js"></script>
<script>
      // 获取轮播图 数据
      http.request('config/list', 'get', {
        page: 1,
        limit: 5
      }, function(res) {
        if (res.data.list.length > 0) {
          let swiperList = [];
          res.data.list.forEach(element => {
            if (element.value != null) {
              swiperList.push({
                img: element.value
              });
            }
          });
          vue.swiperList = swiperList;

		  vue.$nextTick(() => {
		    carousel.render({
		    	elem: '#test1',
		  				width: '100%',
		    	height: '430px',
		    	arrow: 'hover',
		    	anim: 'default',
		    	autoplay: 'true',
		    	interval: '3000',
		    	indicator: 'inside'
		    });
      });

	//类型查询
      categoryList();
	//类型搜索
      $(document).on("click", ".category-search", function(e){
		  vue.swiperIndex = $(this).attr('index')
    	  pageList(e.target.innerText);
      });
          // 获取列表数据
        http.request('xinshubang/list', 'get', param, function(res) {
          vue.dataList = res.data.list
          // 分页
          laypage.render({
            elem: 'pager',
            count: res.data.total,
            limit: limit,
            groups: 3,
            layout: ["prev","page","next"],
            theme: '#065279',
            jump: function(obj, first) {
            	param.page = obj.curr;
              //首次不执行
              if (!first) {
                http.request('xinshubang/list', 'get', param, function(res) {
                  vue.dataList = res.data.list
                })
         }
    });
    window.xznSlide = function() {
      jQuery(".banner").slide({mainCell:".bd ul",autoPlay:true,interTime:5000});
      jQuery("#ifocus").slide({ titCell:"#ifocus_btn li", mainCell:"#ifocus_piclist ul",effect:"leftLoop", delayTime:200, autoPlay:true,triggerTime:0});
      jQuery("#ifocus").slide({ titCell:"#ifocus_btn li", mainCell:"#ifocus_tx ul",delayTime:0, autoPlay:true});
      jQuery(".product_list").slide({mainCell:".bd ul",autoPage:true,effect:"leftLoop",autoPlay:true,vis:5,trigger:"click",interTime:4000});
    };
  </script>
</body>
</html>

五、文档目录:

六、项目总结: 

         对于本次的系统开发来看,它主要是把我以前所学的知识进行了一次综合的应用。经过这次毕业设计的制作它主要是把我以前所学的理论知识应用到社会实践当中。通过这一次的网上图书购物系统的设计与实现它能够有效把计算机知识与实际问题相互应用,通过计算机网络技术来解决用户生活当中的实际问题,从而提高我的编程能力。虽然在这次毕业设计当中我遇到了很多的问题和困难,但是通过不断的调试和老师的帮助让我圆满的完成了这次毕业设计。通过这次毕业设计的制作让我对计算机实际应用得到了很强的锻炼,同时也大大的提高了我的动手动脑能力,让我也感受到了其中的乐趣和喜悦。

        通过这次项目设计的撰写把我在大学期间所学到的东西都应用上了,但是我觉得还是微不足道的,因为在这次毕业设计当中让我深深的了解到对于软件开发和学习理论知识它是两个完全不同的概念。但是通过这次软件的开发让我在以后的工作当中打下了良好的基础。

八、源码获取:

大家点赞、收藏、关注、评论啦 、查看👇🏻👇🏻👇🏻获取联系方式👇🏻👇🏻👇🏻

打卡 文章 更新 308/  365天

 精彩专栏推荐订阅下方专栏👇🏻👇🏻👇🏻👇🏻

java项目精品实战案例《100套》https://blog.csdn.net/weixin_39709134/category_11128297.html

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

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

相关文章

完美解决el-cascader回显失败问题

项目场景&#xff1a; 项目场景&#xff1a;接手了一些老项目&#xff0c;需要做一些日志相关的操作&#xff0c;从后台日志跳转到相应页面要带上原来的请求参数&#xff0c;涉及到一个回显问题 问题描述 Element-UI的 <el-cascader /> 这个组件&#xff0c;赋值之后它…

前端与后端传递数据 — — JSON

前端与后端传递数据 — — JSON 1 前端传送JSON数据给后端 1.1 application/x-www-form-urlencoded默认格式 1.1.1 通过HttpServletRequest获取数据 /*** 通过request获取数据* param request* return*/PostMapping("/testDefaultWithNoAnno1")public String test…

自主Web服务器Http_Server

目录自主web服务器背景目标描述技术特点项目定位项目实现过程创建HttpServer基础框架TcpServer.hppHttpServer.hppLog.hppProtocol.hpp解析C端发来的HTTP报文MSG_PEEK标志位Util.hpp构建请求与响应类读取,解析请求构建响应读取请求解析请求构建响应stat系统函数发送响应sendfil…

使用uni-app开发App简易教程

使用uni-app开发App简易教程前言app端开发步骤1、 申请uniapp开发者账号2、登录后开始新建应用3、下载安装 HBuildder X 。4、新建项目5、开启webview&#xff0c;在pages-index里面写一点点代码6、配置mainifest.json7、打包h5工程配置在html中引入uniapp-sdk解决后退问题上架…

【vue2小知识】实现directive自定义指令的封装与全局注册

&#x1f973;博 主&#xff1a;初映CY的前说(前端领域) &#x1f31e;个人信条&#xff1a;想要变成得到&#xff0c;中间还有做到&#xff01; &#x1f918;本文核心&#xff1a;将我们的自定义指令directive统一管理并批量注册 目录 一、directive自定义指令介绍 二…

Cannot read properties of undefined (reading ‘validate‘)“

1、注意两个地方 1、ref前面 加冒号“&#xff1a;”&#xff0c;还是不加冒号。 2、this.$refs[value].validate()>&#xff08;&#xff09;&#xff0c;更改为this.$refs[value].validate()>(), 不排除this.$refs[value].validate()>(),有时候不会报错 2、示范代码…

解决本地浏览器运行项目时的跨域问题Access to XMLHttpRequest at ‘file:///C:/Users/Len/Desktop/%E5%8F%AF%E4%BF%AE%E6%94%

解决本地浏览器运行项目时的跨域问题-Access to XMLHttpRequest at ‘file:///C:/Users/Len/Desktop/%E5%8F%AF%E4%BF%AE%E6%94%B9%E9%85%8D%E7%BD%AE/dist/model/model.gltf.xz’ from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only supp…

npm sill idealTree buildDeps 安装踩坑指南(详细版)

背景&#xff1a; 已通过nvm安装node 18.8 需要运行 npx create-react-app demo01 首次提醒npm版本过低&#xff0c;但是更新npm失败&#xff0c;并且不再报错&#xff08;安装其他包同样不报错&#xff09; 且换源无果&#xff08;更换淘宝源、清除缓存没效果&#xff09;&am…

【产品新体验】CSDN. 云IDE体验与功能使用教程(保姆级教程)

文章目录前言一、认识云IDE1.1、CSDN.开发云1.2、秘钥管理二、实战-使用云IDE2.1、初步实战springboot-demo&#xff08;clone默认模板代码&#xff09;2.1.1、新建工作空间2.1.2、启动springboot-demo项目2.1.3、编写一个helloworld接口2.2、运行前端工程项目2.2.1、初步尝试—…

Node.js卸载与重装,zip与msi安装详解

Node js卸载与重装&#xff0c;zip与msi安装详解 文章目录Node js卸载与重装&#xff0c;zip与msi安装详解卸载安装选择msi下载安装第一步&#xff1a;第二步&#xff1a;第三步&#xff1a;选择zip压缩包安装&#xff08;选择msi安装的已可以看下这个&#xff09;第一步&#…

Vue项目实战——【基于 Vue3.x + Vant UI】实现一个多功能记账本(登录注册页面,验证码)

基于 Vue3.x Vant UI 的多功能记账本&#xff08;四&#xff09; 文章目录基于 Vue3.x Vant UI 的多功能记账本&#xff08;四&#xff09;项目演示1、登录注册页面2、图片验证码3、修改 axios4、写到最后&#xff08;附源码&#xff09;系列内容参考链接基于 Vue3.x Vant U…

Vue3预览并打印PDF的两种方法

项目场景&#xff1a;后台接口请求数据&#xff0c;返回PDF文档的链接&#xff0c;在vue3页面可预览和打印该PDF。 在之前的Vue2项目中&#xff0c;预览并打印PDF用的是vue-pdf这个插件&#xff0c;但在vue3中是不支持的&#xff0c;只能换个插件了&#xff0c;于是经过测试&a…

jquery怎么给元素设置属性

设置方法&#xff1a;1、使用attr()方法&#xff0c;语法“$(selector).attr(属性名,值)”或“$(selector).attr({属性名:值;})”&#xff1b;2、使用prop()方法&#xff0c;语法“$(selector).prop(属性名,值)”。 1、使用attr()方法 attr() 方法设置或返回被选元素的属性值…

共享主机和 WordPress 主机之间的区别

&#x1f482; 个人网站:【海拥】【摸鱼游戏】【神级源码资源网站】&#x1f91f; 前端学习课程&#xff1a;&#x1f449;【28个案例趣学前端】【400个JS面试题】&#x1f485; 想寻找共同学习交流、摸鱼划水的小伙伴&#xff0c;请点击【摸鱼学习交流群】&#x1f4ac; 免费且…

npm install 报错(npm ERR! code EPERM npm ERR! syscall mkdir npm ERR! path D:\node.js\odejs)

今天我正好要学习TS需要typeScript这个插件但是我用npm i typescript -g 这个命令安装的时候报错&#xff0c;我花了1个时才解决这个问题&#xff0c;下面我为大家提供一些解决方案 1.全部错误install 2.错误详解 该错误发生在修改npm的全局安装路径之后&#xff0c;再执行npm…

【Web 三件套】个人简单博客系统页面搭建(附源码)

文章目录1. 成品展示2. 知识准备3. 博客系统页面搭建3.1 基本介绍3.2 博客列表页3.3 博客详情页3.4 博客登录页3.5 博客编辑页3.6 公共页面样式3.7 markdown 编辑器引入4. 总结1. 成品展示 以下为个人搭建的一个简单博客系统页面&#xff0c;以后会不断改进&#xff0c;并且与…

VsCode镜像下载(国内镜像源,高速秒下)

VsCode镜像下载&#xff08;国内镜像源&#xff0c;高速秒下&#xff09;vscode官方网站下载速度太慢&#xff0c;非正规网站又不太敢下&#xff0c;通过镜像源下载就好了。你们不介意版本的话&#xff0c;下面是1.63版本的链接&#xff08;直接复制下载就好了&#xff09;&…

猿创征文|一文带你了解前端开发者工具

前端开发者工具目录一、前言二、前端开发者工具——编译器&#xff08;含插件&#xff09;1、VS Code2、VS Code 必备插件3、WebStorm三、前端开发者工具——UI 框架工具1、Element2、Vant四、前端开发者工具——API 调试工具1、ApiPost五、写在最后&#xff08;总结&#xff0…

Module not found: Error: Can‘t resolve “xxx“ in “xxx“导致该问题的解决方案

先看报错提示 根据报错提示反应的情况是&#xff1a;找不到模块&#xff1a;错误&#xff1a;无法解析 在遇到报错时应该仔细阅读报错提示&#xff0c;这样解决起来也不会没有头绪 在红色遮挡下有该报错出现的主要原因 在此处我们谈论一下解决该类报错的几种方法 1&#xff…

uniapp 总结篇 (小程序)

前期概述&#xff1a;做了很长时间的小程序了&#xff0c;在此做一个完整的项目总结&#xff0c;希望可以帮助到正在学习、开发的小伙伴。此篇文章并不涉及一些原理&#xff0c;更重要的是帮助大家实现功能、流程。 uniapp 还是很强大的 可以开发 小程序、h5、pc、app 一、创…