XSwitch结合项目实战

背景

基于组件库进行二次开发后,调试组件库项目难度大,demo无法完全覆盖;传统方式猜测可能出现的问题后修改,打包给到使用方,有点类似于盲改。

由于项目的特殊性,目前只尝试了在本地打包生成dist包,通过live-server本地启动文件服务进行调试。插件基于谷歌浏览器,无法对移动端进行真机调试。

安装谷歌插件xswitch

谷歌商店安装,或者是通过连接 xswitch

本地组件库dist包启动

1、采用live-server启动文件服务器。live-server 安装 npm install live-server -g

进入dist文件目录下,运行live-server 。或者live-server --port=xxx。

2、 采用http-server启动,npm install http-server -g 运行 http-server ./ './'从根目录下寻找index.html;

虽然umi官方推荐使用 $SOCKET_SERVER=http://127.0.0.1:8000/ npx umi dev 启动本地,但是由于我们是已经打包好的dist静态文件,所以需要一个第三方的工具启动本地服务器。

结合项目进行规则配置

bash 复制代码
`{"proxy": [
       ["http://线上项目地址/static/vendor/xxx/(.*.js)",
       "http://127.0.0.1:8080/$1"],
       ["http://线上项目地址/static/vendor/xxx/(*.css)",
       "http://127.0.0.1:8000/$1"],
       ["http://线上项目地址/static/vendor/xxx/*/*",
       "http://127.0.0.1:8080/$1/$2"]
    ],
}   `
相关推荐
独立开阀者_FwtCoder5 分钟前
你用 Cursor 写公司的代码安全吗?
前端·javascript·github
Cacciatore->16 分钟前
React 基本介绍与项目创建
前端·react.js·arcgis
摸鱼仙人~17 分钟前
React Ref 指南:原理、实现与实践
前端·javascript·react.js
teeeeeeemo18 分钟前
回调函数 vs Promise vs async/await区别
开发语言·前端·javascript·笔记
贵沫末37 分钟前
React——基础
前端·react.js·前端框架
aklry1 小时前
uniapp三步完成一维码的生成
前端·vue.js
Rubin931 小时前
判断元素在可视区域?用于滚动加载,数据埋点等
前端
爱学习的茄子1 小时前
AI驱动的单词学习应用:从图片识别到语音合成的完整实现
前端·深度学习·react.js
用户3802258598241 小时前
使用three.js实现3D地球
前端·three.js
程序无bug1 小时前
Spring 面向切面编程AOP 详细讲解
java·前端