记录在项目中引用本地的npm包

news2024/10/11 0:31:49

1、先把需要的包下载下来,以Photo Sphere Viewer 为引用的npm包、项目以shpereRepo为例子

git clone https://github.com/mistic100/Photo-Sphere-Viewer

2、拉下代码后修改之后执行 ./build.sh
build.sh

#!/usr/bin/env bash

yarn run build
targetDir="../shpereRepo/packages/basic/photo-sphere-viewer-dist"
mkdir -p $targetDir/core/dist
mkdir -p $targetDir/markers-plugin/dist
mkdir -p $targetDir/autorotate-plugin/dist

# 拷贝文件到 dist 子文件夹中
cp -rf ./packages/core/dist $targetDir/core
cp -rf ./packages/markers-plugin/dist $targetDir/markers-plugin
cp -rf ./packages/autorotate-plugin/dist $targetDir/autorotate-plugin

3、在shpereRepo 创建photo-sphere-viewer-dist 文件夹
4、在引用包的项目中的package.json修改为本地地址
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/547c156bf06e4a5b90206cef0b87316c.png在这里插入图片描述

5、执行安装 pnpm install
6、运行项目

另也可以用node,把它写入到项目指定文件夹
修改package.json

build": "turbo run build && node copyFolders.js",

附copyFolders.js


const fs = require('fs');
const path = require('path');

const autorotatePluginPath = './packages/autorotate-plugin/dist';
const markersPluginPath = './packages/markers-plugin/dist';
const corePath = './packages/core/dist';
const targetDirectory = '../shpereRepo/packages/basic/photo-sphere-viewer-dist';

// 创建目标文件夹
if (!fs.existsSync(targetDirectory)) {
  fs.mkdirSync(targetDirectory, { recursive: true });
}

// 拷贝文件夹函数
function copyFolder(sourceFolderPath, targetFolderName) {
  const targetFolderPath = path.join(targetDirectory, targetFolderName);
  fs.mkdirSync(targetFolderPath, { recursive: true });

  const files = fs.readdirSync(sourceFolderPath);
  files.forEach(file => {
    const sourceFilePath = path.join(sourceFolderPath, file);
    const targetFilePath = path.join(targetFolderPath, file);
    fs.copyFileSync(sourceFilePath, targetFilePath);
    console.log(`${sourceFilePath} 文件拷贝完成!`);
  });

  console.log(`${sourceFolderPath} 文件夹拷贝完成!`);
}

// 拷贝指定文件夹到目标位置
copyFolder(autorotatePluginPath, 'autorotate-plugin/dist');
copyFolder(markersPluginPath, 'markers-plugin/dist');
copyFolder(corePath, 'core/dist');

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

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

相关文章

SpringBoot 登录认证(二)

HTTP是无状态协议 HTTP协议是无状态协议。什么又是无状态的协议? 所谓无状态,指的是每一次请求都是独立的,下一次请求并不会携带上一次请求的数据。而浏览器与服务器之间进行交互,基于HTTP协议也就意味着现在我们通过浏览器来访…

jmeter中参数加密

加密接口常用的方式有: MD5,SHA,HmacSHA RSA AES,DES,Base64 压测中有些参数需要进行加密,加密方式已接口文档为主。 MD5加密 比如MD5加密的接口文档: 请求URL:http://101.34.221…

Unity AI Navigation自动寻路

目录 前言一、Unity中AI Navigation是什么?二、使用步骤1.安装AI Navigation2.创建模型和材质3.编写向目标移动的脚本4.NavMeshLink桥接组件5.NavMeshObstacle组件6.NavMeshModifler组件 三、效果总结 前言 Unity是一款强大的游戏开发引擎,而人工智能&a…

基于单片机病房呼叫系统数码管显示房号设计

**单片机设计介绍,基于单片机病房呼叫系统数码管显示房号设计 文章目录 一 概要二、功能设计设计思路 三、 软件设计原理图 五、 程序六、 文章目录 一 概要 基于单片机病房呼叫系统数码管显示房号设计概要主要涵盖了利用单片机技术实现病房呼叫系统,并…

基于springboot实现校园周边美食探索及分享平台系统项目【项目源码+论文说明】计算机毕业设计

基于springboot实现园周边美食探索及分享平台系统演示 摘要 美食一直是与人们日常生活息息相关的产业。传统的电话订餐或者到店消费已经不能适应市场发展的需求。随着网络的迅速崛起,互联网日益成为提供信息的最佳俱渠道和逐步走向传统的流通领域,传统的…

【SpringCloud】Ribbon负载均衡

🏡浩泽学编程:个人主页 🔥 推荐专栏:《深入浅出SpringBoot》《java对AI的调用开发》 《RabbitMQ》《Spring》《SpringMVC》《项目实战》 🛸学无止境,不骄不躁,知行合一 文章目录 …

新家装修选中央空调如何选?认准约克VRF中央空调

在现代家居生活中,追求舒适和健康生活环境的家庭越来越倾向于选择中央空调系统。面对市场上琳琅满目的中央空调品牌,如何挑选一款合适的家用中央空调成为许多消费者的一大难题。今天,我们以约克VRF中央空调为例,深入探讨其特点和优势,为广大家庭提供一个舒适的选择答案。 首先…

玩美移动升级虚拟试妆体验: 推出3D多色腮红AR试妆解决方案

领先的AI和AR美妆和时尚技术解决方案供应商,以及“美力AI”解决方案开发商——玩美移动于今天宣布,其3D腮红虚拟试妆工具已实现进一步技术提升。用户可以通过三色腮红虚拟试妆体验,尝试更多腮红色号、质地以及多种颜色组合妆效。本次虚拟试妆…

应用方案 D431L可调精密基准源,可耐压35V以上

概述 D431L是一种低压三端可调稳压器,保证在适用温度范围内的热稳定性。输出电压可以设置为VREF(约1.24V)~16V(接两个外部电阻)。该装置具有典型的动态输出0.2Ω的阻抗。在很多应用中,可替代齐纳二极管。 D431L有TO-92和SOT23封装…

Go打造REST Server【二】:用路由的三方库来实现

前言 在之前的文章中,我们用Go的标准库来实现了服务器,JSON渲染重构为辅助函数,使特定的路由处理程序相当简洁。 我们剩下的问题是路径路由逻辑,这是所有编写无依赖HTTP服务器的人都会遇到的问题,除非服务器只处理一到…

用xshell或ftp连接本地虚拟机linux系统,centos7修改动态ip地址

如果不知道怎么下载vm本地虚拟机软件或者不知道怎么安装可以参考我上一篇博客 vmWare虚拟机下载安装详细教程,手把手一步一步教学-CSDN博客 安装好虚拟机软件我们想要通过xshell和ftp工具来管理,小黑框不太舒服哈哈哈 一.准备工作 输入命令来查看当前的ip地址 ip addr 可以…

unity学习(76)--窗口化和后台运行

1.通过如下方式将编译的游戏设置为窗口模式。 成功: 2.现在只有鼠标点击的窗体游戏运动,其他窗体游戏都会卡住。 2.1build setting中 2.2unity内部Project Settings 也被同步修改了

VBA技术资料MF135:多值匹配查找

我给VBA的定义:VBA是个人小型自动化处理的有效工具。利用好了,可以大大提高自己的工作效率,而且可以提高数据的准确度。“VBA语言専攻”提供的教程一共九套,分为初级、中级、高级三大部分,教程是对VBA的系统讲解&#…

unity 数据的可视化

【Unity 实用插件篇】| 可视化图表插件XCharts (折线图、柱状图、饼图等)详细教学-腾讯云开发者社区-腾讯云 Package https://github.com/XCharts-Team/XCharts/releases 官方文档案例 入门教程:5分钟上手 XCharts 3.0 | XCharts (xcharts-team.github.io)

idea2023+jdk1.8+Maven3.6.3+Testng6.10+junit4.13搭建测试

idea2023jdk1.8Maven3.6.3Testng6.10junit4.13搭建测试 首先创建maven工程 导入依赖 pom.xml <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0"xmlns:xsi"http://www.w3.org/2001/…

文心一言 VS 讯飞星火 VS chatgpt (225)-- 算法导论16.3 7题

七、推广赫夫曼算法&#xff0c;使之能生成三进制的码字(即码字由符号0、1、2组成)&#xff0c;并证明你的算法能生成最优三进制码。如果要写代码&#xff0c;请用go语言。 文心一言&#xff1a; 推广赫夫曼算法以生成三进制码字需要对算法进行一定的修改&#xff0c;确保在每…

前端学习<二>CSS基础——08-CSS属性:定位属性

CSS的定位属性有三种&#xff0c;分别是绝对定位、相对定位、固定定位。 position: absolute; <!-- 绝对定位 -->​position: relative; <!-- 相对定位 -->​position: fixed; <!-- 固定定位 -->​ 下面逐一介绍。 相对定位 相对定位&#xff1a;让…

用DataGrip连接hive时报错:User: root is not allowed to impersonate plck5,解决方法

你可以尝试关闭主机校验 修改hive安装目录下conf/hive-site.xml,将hive.server2.enable.doAs设置成false <property><name>hive.server2.enable.doAs</name><value>false</value><description>Setting this property to true will have H…

常用类(日期时间)

目录 一、JDK 8之前的日期时间API1.1、System类中获取时间戳的方法1.2、Java中两个Date类的使用1.3、SimpleDateFormat的使用1.4、Calendar日历类的使用 二、JDK8中日期时间API的介绍2.1、LocalDate、LocalTime、LocalDateTime的使用2.2、Instant类的使用2.3、DateTimeFormatte…

OKCC的API资源管理平台怎么用?

API资源管理平台&#xff0c;重点是“资源”管理平台&#xff0c;不是API接口管理平台。 天天讯通推出的API资源管理平台&#xff0c;类似昆石的VOS系统&#xff0c;区别是VOS是SIP资源管理系统&#xff0c;我们的API资源管理平台是API资源管理系统&#xff08;AXB、AX、回拨AP…