HBuilderX运行时报404错误解决

简介: HBuilderX运行时报404错误解决

前言


生活并无完美,与其让生活带来更多的沮丧与抱怨,不如坚持着一份信念,相信通过努力可以让生活变得更好。

一、问题描述


在开发前后端分离的项目中,前端页面使用HBuilderX进行开发,遇到了一种匪夷所思的情况,前一天前端项目运行还正常,到了第二天再使用HBuilderX运行前端项目时就会报404的错误,不仅是昨天的项目,之前写好的项目运行也是404错误,但是不在HBuilderX中就可以正常打开。因此断定是HBuliderX软件本身的问题,重启电脑、重新打开HBuilderX、重新导入项目等方法都没有解决。

image.png

二、解决方案


打开HBuilderX的存放位置,找到plugins文件夹—>找到nodeserver文件夹—>修改server.js文件

image.png

image.png

image.png

image.png

将server.js文件修改为以下内容:

var args = process.argv.splice(2)[0];
var express = require('express');
var app = express();
var argsjson =JSON.parse(args); 
var projects = argsjson.projects;
var port = argsjson.port;
projects.forEach(function (value,index,array) {
  app.use('/'+encodeURI(value.name),express.static(value.path+''));
});
app.get('*', function(req, res){
    res.sendFile( __dirname + "/" + "404.html" );
});
var server = app.listen(port, function () {
  console.log('server start at '+port);
})

总结


当将上面的代码替换了server.js文件中的代码后重新启动HBuilderX时前端项目就可以正常运行了,但是具体是什么原因也不清楚,源文件也不敢完全覆盖,最后是将原本的server.js重命名,新建了一个server.js文件,将代码复制进去。在此做下记录,如果以后再出现这种情况,能以最快的速度解决这样的问题。

相关文章
|
11天前
|
人工智能 自然语言处理 安全
Vibe Coding 实战:别盲目跟风,先分清 vibe coding 适合什么场景
本文系统总结vibe coding实战经验:明确其适用场景(原型、小工具、标准化模块),剖析5步落地流程(场景判定→结构化提示词→目录初始化→分模块生成→自动化校验),指出四大常见误区,并推荐适配工具Trae。强调“场景匹配+规则前置”是提效关键,避免盲目套用。
1151 1
|
移动开发 JavaScript 前端开发
Element Plus for Vue 3 入门教程
Element Plus 是为了适配 Vue 3 对 Element UI 进行的重构。Vue 3.0 的这次大版本升级,对于第三方组件库来说是一件好事,那些已经修修补补无数次,还无法彻底解决的问题,在这次面向 Vue 3.0 重构时,一次性全部解决。
4118 0
|
10月前
|
数据安全/隐私保护 容器 Go
开源IM即时通讯系统调研
Lumen IM 是一款企业级开源即时通讯工具,前端采用 Vue3 + Naive UI,后端基于 Go 语言,使用 WebSocket 协议。支持 Docker + Nginx 快速部署,适合私有化环境。功能包括文本、图片、文件消息,内置笔记、群聊及消息历史记录。界面美观、功能完善,适用于企业沟通、团队协作及开发者学习。提供前后端源码,便于快速搭建 IM 系统。
开源IM即时通讯系统调研
|
分布式计算 Hadoop Shell
|
JavaScript API
vue3父子组件相互调用方法详解
vue3父子组件相互调用方法详解
10088 10
|
安全 搜索推荐 数据挖掘
陪玩系统源码开发流程解析,成品陪玩系统源码的优点
我们自主开发的多客陪玩系统源码,整合了市面上主流陪玩APP功能,支持二次开发。该系统适用于线上游戏陪玩、语音视频聊天、心理咨询等场景,提供用户注册管理、陪玩者资料库、预约匹配、实时通讯、支付结算、安全隐私保护、客户服务及数据分析等功能,打造综合性社交平台。随着互联网技术发展,陪玩系统正成为游戏爱好者的新宠,改变游戏体验并带来新的商业模式。
1108 1
ER图和对应关系模式(只写关键)
ER图和对应关系模式(只写关键)
2429 0
|
JSON Prometheus 监控
一键部署Prometheus,并预置仪表盘和数据源
一键部署Prometheus + Grafana + cAdvisor + node-exporter,搭建主机或容器监控。利用grafana的provisioning方式,通过配置的方式预置仪表盘和数据源。
1002 1
|
前端开发 容器
css 【详解】—— 图片底部留有间隙(含解决方案)
css 【详解】—— 图片底部留有间隙(含解决方案)
438 0
|
移动开发 UED HTML5
HTML锚点链接的深入解析与应用
HTML锚点链接的深入解析与应用
1333 0