当前位置: 首页 > news >正文

前端架构: 本地调试脚手架的2种方式

一、 调试简单的脚手架方式


假定脚手架名称是 xxx

1 )方式1

  • 在xxx脚手架项目目录的上一级,执行 npm i -g xxx
  • 这时候,就可以本地调试脚手架,在前文中已经说明软链的作用
  • 参考:https://blog.csdn.net/Tyro_java/article/details/136102674
  • 这种方式,可以用到已经发版上线的脚手架项目中

2 )方式2

  • 在未发过版的脚手架项目的根目录中,也就是 xxx/ 下执行 $ npm link 也可以调试本地脚手架
  • 这时候,在当前命令的日志输出中,就会出现两个软链
    • 将当前使用的node目录下的 bin/xxx -> 当前node所使用的node_modules中的 xxx/bin/index.js
      • 注意,这个要确保package.json 中配置的 bin 属性是 bin/index.js
    • 再将当前node所使用的node_modules中的 xxx -> 当前脚手架的项目目录 xxx
    • 注意 -> 表示软链的意思
  • 通过以上两次软链,就可以直接调试当前脚手架项目,做到随时修改,随时使用

二、调试含有分包的脚手架项目

  • 假设有两个平行的项目 x1 和 x2,在x1中需要引入x2包

  • x1的目录结构

    x1
    ├── package.json
    ├── bin└── index.js
    
    • 在package.json 中的 main 属性配置为 bin/index.js
  • x2的目录结构

    x2
    ├── package.json
    ├── lib└── index.js
    
    • 在这里的 lib/index.js中有一个方法
      module.exports = {sum (a, b) {return a + b}
      }
      
    • 在 package.json 中的配置
      • version 配置为 1.0.0
      • main 配置为 lib/index.js (注意,这个是x1引用x2的关键)
  • 如果想要在 x1 中自动连接 x2,尝试

    • 在x1目录的上一级目录执行 $ npm link x2
    • 这种方式,显然是失败的
    • 因为 x2 包还没有发布到 npm 上面
  • 再次尝试,首先在 x2 中执行 $ npm link

    • 让这个包在全局的 node_modules 目录中创建一个软链到当前开发项目 x2 的目录上
    • 这时候,全局环境下的 node_modules 下就可以找到 x2 了
    • 再次回到 x1 根目录 x1/ 下执行 $ npm link x2
  • 到这个时候,环境基本已准备好了,可以在x1中正常引入x2了,在x1中的 package.json 中

    {"dependencies": {"x2": "^1.0.0"}
    }
    
  • 回到 x1 中,进入 bin/index.js 编写

    #!/usr/bin/env nodeconst lib = require('x2');
    const { sum } = lib;
    const result = sum(1 + 2)console.log('result: ', result)
    
    • 验证,在 x1/ 下执行 $ node bin/index.js
      • 输出 result: 3
    • 或者执行 $ x1 来验证
  • 使用这种方式,基于 x1 来调试 x2,调试完成 x2 就可以准备上线了

  • 上线完成后,x1 就可以重新下载 x2 作为依赖了,但是这个时候,可能会出现一些问题

    • 如果直接在 x1/ 下执行 $ npm i 这时候下载的 x2 会被下载到 全局 node_modules 目录下
    • 而项目本地的node_modules 没有写的权限
    • 因为之前存在 link 的行为,而 link 后会在全局 node_modules 下创建软链
    • 这时候,需要执行
      • $ npm unlink x2
        • 注意这里,如果失败的话,尝试: 先执行一次 link x2, 之后再重新 unlink x2
      • $ npm remove -g x2
      • $ npm i x2 -S
  • 注意,以上的方式,不修改项目源码,而是修改本地环境,不会因为后期忘记修改回来或误操作引发bug

  • 修改源码的方式

    • 之前会用 npm 安装本地包,之后 dependencies 中,出现 "bar": "file:foo/bar" 这类的形式
    • 这种,会导致后期上线非常的不方便,而且不注意就会引发问题
  • 这种不修改源码(包括package中的配置)而修改本地环境的方式,可以作为一种最佳实践方式

相关文章:

前端架构: 本地调试脚手架的2种方式

一、 调试简单的脚手架方式 假定脚手架名称是 xxx 1 )方式1 在xxx脚手架项目目录的上一级,执行 npm i -g xxx这时候,就可以本地调试脚手架,在前文中已经说明软链的作用参考:https://blog.csdn.net/Tyro_java/article…...

现阶段适用于 单一架构 还是 分布式架构 ?

单体架构: 优势:简单直接,易于理解和开发,适用于小型应用或刚刚开始的项目。劣势:扩展性受限,只能通过增加服务器的数量来提高处理能力;所有模块都部署在一个单独的服务器或容器中,…...

掌握Go并发:Go语言并发编程深度解析

🏷️个人主页:鼠鼠我捏,要死了捏的主页 🏷️系列专栏:Golang全栈-专栏 🏷️个人学习笔记,若有缺误,欢迎评论区指正 前些天发现了一个巨牛的人工智能学习网站,通俗易懂&…...

创建一个多进程服务器和多线程服务器

多进程服务器 #include<myhead.h> #define PORT 8888 //端口号 #define IP "192.168.10.10" //IP地址//定义信号处理函数&#xff0c;用于回收僵尸进程 void handler(int signo) {if(signo SIGCHLD){while(waitpid(-1, NULL, WNOHAN…...

相机图像质量研究(18)常见问题总结:CMOS期间对成像的影响--CFA

系列文章目录 相机图像质量研究(1)Camera成像流程介绍 相机图像质量研究(2)ISP专用平台调优介绍 相机图像质量研究(3)图像质量测试介绍 相机图像质量研究(4)常见问题总结&#xff1a;光学结构对成像的影响--焦距 相机图像质量研究(5)常见问题总结&#xff1a;光学结构对成…...

18.谈谈你对JSON的理解

JSON 是一种基于文本的轻量级的数据交换格式。它可以被任何的编程语言读取和作为数据格式来传递。 在项目开发中&#xff0c;使用 JSON 作为前后端数据交换的方式。在前端通过将一个符合 JSON 格式的数据结构序列化为 JSON 字符串&#xff0c;然后将它传递到后端&#xff0c;后…...

绝地求生:“觉醒之旅”通行证曝光,西游主题通行证及成长型武器即将上线

随着27赛季即将结束&#xff0c;有关28.1版本的皮肤及通行证内容也被爆料出来&#xff0c;本次通行证为工坊通行证&#xff0c;和去年四圣兽通行证为同一类型&#xff0c;将于2月7日更新至正式服 除了通行证获取工坊币还是可以开箱获取并兑换一些奖励 先看通行证 四个套装应该分…...

JS如何判断普通函数与异步(async)函数

这里可以先打印一下普通函数和异步&#xff08;async&#xff09;函数的结构&#xff0c;如下图 可以看出两者原型链&#xff0c;普通函数的原型链指向的是一个函数&#xff0c;异步&#xff08;async&#xff09;函数原型链指向的是一个AsyncFunction&#xff0c;这时就会想到…...

ndk-r20b 编译 boost 1.74。

ndk-r20b 编译 boost 1.74&#xff0c;这是 ndk-r20b 支持得最大 boost 版本&#xff0c;再大就没法编译支持了&#xff0c;本文介绍方法是完整编译&#xff0c;不需要完整编译请转移到github&#xff0c;boost for android 得开源项目。 1.74 boost &#xff0c;安卓上面得版本…...

尚硅谷最新Node.js 学习笔记(四)

目录 八、express框架 8.1、express介绍 8.2、express使用 express下载 express初体验 8.3、express路由 什么是路由&#xff1f; 路由的使用 获取请求参数 获取路由参数 8.4、express响应设置 8.5、express中间件 什么是中间件&#xff1f; 中间件的作用 中间件…...

掌握XGBoost:GPU 加速与性能优化

导言 XGBoost是一种强大的机器学习算法&#xff0c;但在处理大规模数据时&#xff0c;传统的CPU计算可能会变得缓慢。为了提高性能&#xff0c;XGBoost可以利用GPU进行加速。本教程将介绍如何在Python中使用XGBoost进行GPU加速以及性能优化的方法&#xff0c;并提供相应的代码…...

【2024年毕设系列】如何使用Anaconda和Pycharm

【2024年毕设系列】如何使用Anaconda和Pycharm 视频教程地址&#xff1a;【2024毕设系列】Anaconda和Pycharm如何使用_哔哩哔哩 Hi&#xff0c;各位好久不见&#xff0c;这里是肆十二&#xff0c;首先在这里给大伙拜年了。 诸位过完年之后估计又要开始为了大作业和毕业设计头疼…...

Blazor OIDC 单点登录授权实例5 - 独立SSR App (net8 webapp ) 端授权

目录: OpenID 与 OAuth2 基础知识Blazor wasm Google 登录Blazor wasm Gitee 码云登录Blazor OIDC 单点登录授权实例1-建立和配置IDS身份验证服务Blazor OIDC 单点登录授权实例2-登录信息组件wasmBlazor OIDC 单点登录授权实例3-服务端管理组件Blazor OIDC 单点登录授权实例4 …...

基于蒙特卡洛的电力系统可靠性分析matlab仿真,对比EDNS和LOLP

目录 1.课题概述 2.系统仿真结果 3.核心程序与模型 4.系统原理简介 1.课题概述 电力系统可靠性是指电力系统按可接受的质量标准和所需数量不间断地向电力用户供应电力和电能量的能力的量度&#xff0c;包括充裕度和安全性两个方面。发电系统可靠性是指统一并网的全部发电机…...

Spring boot整合redisson报错

Spring boot整合redisson报错 org.redisson.client.RedisConnectionException: Unable to connect to Redis server: localhost/127.0.0.1:6379 原因 原因是计算机连接不上redis导致的 解决方案 重启redis 在redis文件目录下打开cmd 1.检查redis是否在运行 redis-cli p…...

【AIGC】Stable Diffusion的ControlNet插件

ControlNet 介绍 ControlNet 插件是 Stable Diffusion 中的一个重要组件&#xff0c;用于提供对模型的控制和调整。以下是 ControlNet 插件的主要特点和功能&#xff1a; 模型控制&#xff1a; ControlNet 允许用户对 Stable Diffusion 中的模型进行精细的控制和调整。用户可以…...

【蓝桥杯单片机入门记录】认识单片机

目录 单片机硬件平台 单片机的发展过程 单片机开发板 单片机基础知识 电平 数字电路中只有两种电平&#xff1a;高和低 二进制&#xff08;8421码&#xff09; 十六进制 二进制数的逻辑运算 “与” “或” “异或” 标准C与C51 如何学好单片机 端正学习的态度、培…...

Rust 数据结构与算法:3栈:用栈实现符号匹配

1、符号匹配 如&#xff1a; (56)(78)/(43)、{ { ( [ ] [ ])}}、(ab)(c*d)func() 等各类语句的符号匹配。 这里我们关注的不是数字而是括号&#xff0c;因为括号更改了操作优先级&#xff0c;限定了语言的语义&#xff0c;这是非常重要的。如果括号不完整&#xff0c;那么整个…...

用ESP8266快速实现WIFI红外遥控器(SoC模式)

1&#xff0c;硬件结构图 主要使用了esp8266 wifi模块和红外串口通讯模块。有了红外串口通讯模块&#xff0c;省去了单片机的串口通讯和红外编码程序&#xff0c;大大缩短开发时间。因为红外通讯模块不支持3.3VTTL电平&#xff0c;所以两个模块之间加了一个2路电平转换模块&…...

微服务OAuth 2.1认证授权可行性方案(Spring Security 6)

文章目录 一、背景二、微服务架构介绍三、认证服务器1. 数据库创建2. 新建模块3. 导入依赖和配置4. 安全认证配置类 四、认证服务器测试1. AUTHORIZATION_CODE&#xff08;授权码模式&#xff09;1. 获取授权码2. 获取JWT 2. CLIENT_CREDENTIALS(客户端凭证模式) 五、Gateway1.…...

【Python】 -- 趣味代码 - 小恐龙游戏

文章目录 文章目录 00 小恐龙游戏程序设计框架代码结构和功能游戏流程总结01 小恐龙游戏程序设计02 百度网盘地址00 小恐龙游戏程序设计框架 这段代码是一个基于 Pygame 的简易跑酷游戏的完整实现,玩家控制一个角色(龙)躲避障碍物(仙人掌和乌鸦)。以下是代码的详细介绍:…...

OkHttp 中实现断点续传 demo

在 OkHttp 中实现断点续传主要通过以下步骤完成&#xff0c;核心是利用 HTTP 协议的 Range 请求头指定下载范围&#xff1a; 实现原理 Range 请求头&#xff1a;向服务器请求文件的特定字节范围&#xff08;如 Range: bytes1024-&#xff09; 本地文件记录&#xff1a;保存已…...

2025年渗透测试面试题总结-腾讯[实习]科恩实验室-安全工程师(题目+回答)

安全领域各种资源&#xff0c;学习文档&#xff0c;以及工具分享、前沿信息分享、POC、EXP分享。不定期分享各种好玩的项目及好用的工具&#xff0c;欢迎关注。 目录 腾讯[实习]科恩实验室-安全工程师 一、网络与协议 1. TCP三次握手 2. SYN扫描原理 3. HTTPS证书机制 二…...

PHP 8.5 即将发布:管道操作符、强力调试

前不久&#xff0c;PHP宣布了即将在 2025 年 11 月 20 日 正式发布的 PHP 8.5&#xff01;作为 PHP 语言的又一次重要迭代&#xff0c;PHP 8.5 承诺带来一系列旨在提升代码可读性、健壮性以及开发者效率的改进。而更令人兴奋的是&#xff0c;借助强大的本地开发环境 ServBay&am…...

【Linux系统】Linux环境变量:系统配置的隐形指挥官

。# Linux系列 文章目录 前言一、环境变量的概念二、常见的环境变量三、环境变量特点及其相关指令3.1 环境变量的全局性3.2、环境变量的生命周期 四、环境变量的组织方式五、C语言对环境变量的操作5.1 设置环境变量&#xff1a;setenv5.2 删除环境变量:unsetenv5.3 遍历所有环境…...

在golang中如何将已安装的依赖降级处理,比如:将 go-ansible/v2@v2.2.0 更换为 go-ansible/@v1.1.7

在 Go 项目中降级 go-ansible 从 v2.2.0 到 v1.1.7 具体步骤&#xff1a; 第一步&#xff1a; 修改 go.mod 文件 // 原 v2 版本声明 require github.com/apenella/go-ansible/v2 v2.2.0 替换为&#xff1a; // 改为 v…...

多元隐函数 偏导公式

我们来推导隐函数 z z ( x , y ) z z(x, y) zz(x,y) 的偏导公式&#xff0c;给定一个隐函数关系&#xff1a; F ( x , y , z ( x , y ) ) 0 F(x, y, z(x, y)) 0 F(x,y,z(x,y))0 &#x1f9e0; 目标&#xff1a; 求 ∂ z ∂ x \frac{\partial z}{\partial x} ∂x∂z​、 …...

Python爬虫实战:研究Restkit库相关技术

1. 引言 1.1 研究背景与意义 在当今信息爆炸的时代,互联网上存在着海量的有价值数据。如何高效地采集这些数据并将其应用于实际业务中,成为了许多企业和开发者关注的焦点。网络爬虫技术作为一种自动化的数据采集工具,可以帮助我们从网页中提取所需的信息。而 RESTful API …...

大模型——基于Docker+DeepSeek+Dify :搭建企业级本地私有化知识库超详细教程

基于Docker+DeepSeek+Dify :搭建企业级本地私有化知识库超详细教程 下载安装Docker Docker官网:https://www.docker.com/ 自定义Docker安装路径 Docker默认安装在C盘,大小大概2.9G,做这行最忌讳的就是安装软件全装C盘,所以我调整了下安装路径。 新建安装目录:E:\MyS…...

【多线程初阶】单例模式 指令重排序问题

文章目录 1.单例模式1)饿汉模式2)懒汉模式①.单线程版本②.多线程版本 2.分析单例模式里的线程安全问题1)饿汉模式2)懒汉模式懒汉模式是如何出现线程安全问题的 3.解决问题进一步优化加锁导致的执行效率优化预防内存可见性问题 4.解决指令重排序问题 1.单例模式 单例模式确保某…...