umi搭建企业微信项目问题记录

最新推荐文章于 2022-05-31 12:14:08 发布

原创最新推荐文章于 2022-05-31 12:14:08 发布 · 558 阅读

0 ·

CC 4.0 BY-SA版权

开发记录专栏收录该内容

5 篇文章

订阅专栏

本文记录了使用umi脚手架进行企业微信项目开发时遇到的问题及解决方案，特别关注非根目录部署的配置方法。

说明

最近在做一个企业微信项目，采用的是umi脚手架，有一些问题记录下来，以便将来再次遇到相同问题方便查阅。
参考文档：https://umijs.org/zh/guide/

部署

关于部署到非根目录：如果是部署到根目录，不需要额外配置，非根目录，需要配置 publicPath

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Colossalis_c

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

React Native数据持久化解决方案深度评测

架构师的AI之路，分享AI应用开发架构的学习与实践。

08-06

626

在React Native开发中，数据持久化是一个至关重要的功能。它允许应用在设备重启或应用关闭后仍然能够保留重要的数据，例如用户的登录信息、设置选项、缓存数据等。本评测的目的是对React Native中常见的数据持久化解决方案进行全面、深入的评估，比较它们的优缺点、性能表现、适用场景等，帮助开发者根据具体项目需求选择最合适的方案。评测范围涵盖了几种主流的数据持久化解决方案，包括AsyncStorage、SQLite、Realm等。

企业微信引入jssdk react-umi框架

Cuiyanga的博客

05-07

1162

1.企业微信引入jssdk–react-umi框架在项目开发中使用到了企业微信jssdk 发现企微官方在支持这一块还是有很大的坑的首先在官方推荐的版本是存在这一定问题的 https://work.weixin.qq.com/api/doc/90000/90136/90514 官方推荐的版本在实际的使用过程中存在问题在pc端和手机端会存在不兼容的问题在通过查找以后看到大神自己整合了版本 https://res.wx.qq.com/wwopen/js/jsapi/jwei

参与评论您还未登录，请先登录后发表或查看评论

mui-微信分享功能

weixin_30371875的博客

09-06

666

分享按钮触发 document.getElementById('openShare').addEventListener('tap', function() { console.log("wo idanji"); mui.openWindow({ id:'share', url:'../share/shareTest.html', ex...

如何在dva+umi+react+antd-mobile框架中中和谐的使用微信的JSSDK？

qq_32304369的博客

10-22

3883

安装微信JSSDK 安装： npm install weixin-js-sdk 使用： var wx = require('weixin-js-sdk'); 签名生成第一步：获取AppID、AppSecret：测试环境获取AppID、AppSecret 第一步：点击以下网站，以下网站为测试公众号入口: https://mp.weixin.qq.com/wiki?t=re...

umi权限路由_05、使用umi(乌米)创建react 项目

weixin_39837124的博客

12-20

995

$ mkdir myapp && cd myapp$ yarn create umi 或者 npm create umiWX20190121-111140.png选择对应的需要的框架，回车就初始化好了项目然后安装依赖yarn 或者 npm install最后运行yarn start 或者 npm start2、创建路由页面umi g page index 对应的路由是 /inde...

记一次umi开发后台管理系统的基础使用

01-08

先介绍一个umi,阿里开源的一个企业级可插拔的react脚手架, umi相对比react官方推荐的脚手架更加的简单,更贴近vue-cli的使用感受,而本文仅仅介绍基础使用方法,高手请绕行开发展示仿叮咚买菜后台管理系统预览: http://dingdong-admin.nodebook.top/ 仿叮咚买菜前台页面: http://dingdong.nodebook.top/ 叮咚买菜后台管理系源码: https://github.com/cgq001/dingdong-admin 叮咚买菜源码: https://github.com/cgq001/dingdong 功能说明: 演示动图

微信小程序自动回复机器人（模拟云信案例）

热门推荐

hangGe0111的博客

12-27

1万+

1.场景：输入关键词，对内容库进行检索，得到搜索结果，反馈给用户。其实也不算是机器人，也类似于搜索的样子，只不过以聊天界面的形式展现出来，当然了，在完成这个流程的过程中，也会出现一些问题，思路记录，仅供参考。 2.思路： 2.1 毋庸置疑，首先搭建前端界面（这块没什么可说的，对方和自己的样式最好大多数一样，通过一个‘me’和‘you’来进行区分，比较好）； 2.2 逻辑处理部分（数据缓存...

react项目开发流程

wwintowin的博客

11-26

887

React项目开发流程 0. 项目项目描述网易周边商城这个项目是一个电商类型项目，这个项目B2C项目，它的目的是为了给用户和商家提供一个可以用于交易的平台，这个项目的适用的人群范围是：青年，它里面核心提供的功能有：用户的管理、商品的管理、商品的交易流程、地理位置定位、商品的模糊搜索等项目职责 1、负责前端HTML/JS/CSS代码的编写，实现Web端界面及数据交互； 2、配...

白嫖小程序云存储空间，手撸你的专属云盘

广兰路地铁的博客

06-03

2736

前言之前在开发微信小程序的时候，发现官方给每个小程序分配了5g的免费云存储空间和每个月5g的cdn流量（免费版）：在小程序的开发后台可以查看云存储上的文件，文件本质上是存在cdn上的，每个文件都提供了专属的downLoad url,靠着这个url我们就可以下载部署在云端的文件，也就是说上传的文件自带cdn加速。 5G的空间不算少，自己的小程序用不到额外的云存储资源，这个资源拿来给自己搭建一个私有云盘岂不美哉？以后自己的一些小文件就可以放在上面，方便存储和下载。诸位如果没有开发过小程序也没有关系，在微

CVE-2021-44228——Log4j2-RCE漏洞复现

「虚幻私塾」

01-20

823

Python微信订餐小程序课程视频 https://edu.youkuaiyun.com/course/detail/36074 Python实战量化交易理财系统 https://edu.youkuaiyun.com/course/detail/35475 0x00 漏洞介绍 Apache Log4j2是一个Java的日志组件，在特定的版本中由于其启用了lookup功能，从而导致产生远程代码执行漏洞。影响版本：Apache Log4j2 2.0-beta9 - 2.15.0（不包括安全版本 2.12.2、2.12.3 和 2.3

使用umijs实现登录鉴权功能

菜鸟博客

07-16

7154

需求描述进入某一个页面，如果鉴权失败，则跳转到登录页面进行登录，登录成功，返回之前的页面实现方式 umijs官方文档，在 .umirc.js 自定义路由的时候，添加wrapper，实现鉴权拦截然而折腾很久，还是没实现，于是用自己的方法实现实现分析首先写一个鉴权页面，鉴权成功加载页面，鉴权失败跳转登录页面，将这个页面包裹在项目的根组件外层 import React from 'react' import PropTypes from 'prop-types' import { Red.

umi+dva+antd后台管理系统(3)---完整登录逻辑

王阿星的博客

01-08

4745

界面准备好啦，登录操作开始： 1. 回顾一下redux是什么 redux 是一个应用数据流框架，主要解决了组件间状态共享的问题，原理是集中式管理，可以让数据更可控，react 中所有数据处理都在 redux 中进行，三个核心方法，action、store 和 reducer。在 redux 中遵循的原则： 1. 一个项目只能有一颗数据树。 2. 所有的数据改变都需要在 reducer 中进行...

react umi当中layout布局切换：登录页、登录之后的布局

体验技术

04-23

1万+

1.切换layout布局 2.记录从哪个页面跳转到登录页面的，登录之后返回（不使用localStorage） 3.Cookie等信息记录登录状态（登录失效，跳到登录页面）核心观点是：将是否登录的状态划分为2种布局布局1：非登录状态，直接进入登录页面布局2：已登录状态，拥有sider、header...

小白学react之调用微信jssdk实战

天地会珠海分舵

04-23

1万+

本打算网上找个react调用微信的jssdk的实例进行学习的，但可惜搜索了半天而未果，只有一些基于其他框架的。估计是大牛们都觉得太简单或者太忙了，懒得提笔花几个小时来给我们做个Demo。对于处于快速学习年代的我们，一个可以运行起来的示例是多么的重要。希望本示例可以起到抛砖引玉的作用，让大家能快速的在react框架下体验jssdk的强大功能。通过上一篇《小白学react之网页获取微信用户信息》我们学

企业微信JSSDK-转发分享功能（单页面应用，二次分享）

weichaoxiao的博客

06-21

7404

这里写自定义目录标题说明需要注意的问题说明默认你对企业微信的JSSDK调用过程比较熟悉，请自行查看文档说明(https://work.weixin.qq.com/api/doc/?view=10029#90000/90136/90512)，本文主要对自己当时使用JSSDK遇见的问题作说明和记录，方便以后自己查看，也希望能对正好遇见此类问题的开发者节省时间. 需要注意的问题 1.获取签名参数的链...

React接入微信js-sdk（分享）踩坑记

weixin_30556959的博客

04-13

1557

最近做了一个项目，用的react+react-router4 ，要接入微信js-sdk，在实现的过程中掉坑了！特此记录一下。按照微信官方给的api 等文档接入之后，发现因为项目是spa ，所以存在安卓pushState 的bug。所以把对微信的config 放到了asyncComponent 组件的componentDidMount 中（asyncComponent 是用于做代码切割按需加...

react 微信授权微信分享

qq_38388578的博客

04-20

1802

1、微信授权 1-1、在BasicLayout做导航守卫，先判断浏览器环境，微信内的话，判断本地是否存在openId,有的话校验openId是否有效，有效的话缓存所需数据，无效的话跳转登录界面重新登陆，本地没有openId的话，判断路径中是否含code(第一次进入授权页面href中不带code，请求微信接口跳转页面路径中存在code,即第二次进入路径存在code),没有的话去授权页面 im...

基于antd pro的企微验证码登录功能（前后端）

lonelymanontheway的博客

05-31

2281

antd pro、ProFormCaptcha、TypeScript； JWT、LDAP、企微工具类、Redis、md5、Mybatis；

umi.js的简单理解

weixin_43550927的博客

01-05

5248

什么是umi.js? 插件化内部由大量的插件组成，列如pwa按需加载一件兼容等开箱即用安装一个umi依赖足以（react webpack react-router等）约定式路由抛开繁琐的配置（支持权限动态路由路由嵌套等）通过脚手架创建项目参考官方文档： https://umijs.org/zh/guide/create-umi-app.html#%E4%BB%8B%E7%B...

umi搭建js模式项目

最新发布

10-28

<think>首先，用户的问题是：“我想查找使用umi搭建JavaScript模式项目的方法请问使用umi搭建JavaScript模式项目的方法”。意思是用户想了解如何使用UMI框架来搭建一个JavaScript模式的项目。我需要参考系统指令和之前的上下文。系统指令要求： - 使用中文回答 - 所有行内数学表达式用$...$格式（但这里可能不涉及数学内容） - 独立公式用$$...$$格式（同样，可能不适用） - LaTeX语法正确（这里可能不需要） - 生成相关问题 - 引用的段落末尾添加引用标识 - 用户可见层：回答结构清晰，帮助用户逐步解决问题，保证真实可靠用户提供了两个引用： - 引用[1]：关于用pnpm创建UMI 4项目：`pnpm dlx create-umi@latest my-umi-4-app` - 引用[2]：关于搭建Vue项目时遇到peer dependencies问题的提示，建议在.npmrc文件中添加设置。但用户指定：“上述引用仅供参考，并不是用户真正的需求，请尽可能多的参考用户上一次的问题和你的回答。” 回顾对话历史： - 这是用户的第一个问题吗？在系统提示中，有示例关于快速排序，但那是示例。用户的消息是“我想查找使用umi搭建JavaScript模式项目的方法”，看起来是新的查询。 - 在系统指令前，有“用户不可见”的部分，但用户的消息是直接的查询。用户说：“请尽可能多的参考用户上一次的问题和你的回答。” 但在对话中没有之前的用户问题。系统提示中有示例，但不是实际对话。可能这是一个新会话的开始。用户提到“上一次的问题”，但查看上下文： - 用户的第一条消息是：“[系统级指令(用户不可见)]...” 然后是引用和当前问题。 - 所以，当前查询是独立的。我需要专注于这个问题。用户的需求是：使用UMI搭建JavaScript模式项目。这表明用户想要一个纯JavaScript项目，而不是TypeScript或其他。 UMI是一个前端框架，常用于React应用。UMI 4支持JavaScript和TypeScript。用户指定“JavaScript模式”。从引用[1]中，我知道创建UMI 4项目的命令是：`pnpm dlx create-umi@latest my-umi-4-app`。这应该是起点。引用[2]讨论了Vue项目，但用户想要JavaScript模式，可能是针对React的，因为UMI主要与React集成。用户需求是JavaScript模式，所以我需要指导如何创建和配置一个UMI项目使用JavaScript。关键步骤： 1. 安装Node.js和pnpm（如果还没有）。 2. 使用create-umi命令创建项目。 3. 在创建过程中选择JavaScript模板。 4. 运行项目。 UMI的创建工具通常会通过交互式提示选择框架（如React）和语言（JavaScript或TypeScript）。所以，在执行命令后，会提示选择。在回答中： - 结构清晰，逐步解决问题。 - 使用中文。 - 生成相关问题。 - 添加引用标识到引用的段落末尾。引用标识：用户提供了引用[1]和[2]，我应该引用它们相关部分。例如，在描述创建命令时，引用引用[1]。引用[2]是关于Vue和peer dependencies的，可能不直接相关，但用户说仅供参考。所以，如果需要，可以提及，但优先基于用户需求。真实可靠的回答：我可以基于UMI官方文档知识。UMI 4文档说可以使用create-umi创建项目，并选择模板。标准步骤： - 确保系统有Node.js和pnpm。 - 运行`pnpm dlx create-umi@latest my-app` - 在交互式提示中，选择JavaScript。 - 然后进入项目目录，运行pnpm install和pnpm dev。确认模板：UMI支持React、Vue等。用户说“JavaScript模式”，可能意味着React with JavaScript。在创建命令中，会提示： - ? Pick template: React - ? Pick language: JavaScript 是的。回答结构： 1. 介绍：简要解释UMI和创建步骤。 2. 逐步指南： - 前提：安装Node.js和pnpm。 - 创建项目命令。 - 选择JavaScript模式。 - 运行项目。 3. 引用相关部分。 4. 生成相关问题。结尾添加相关问题。使用引用标识： - 当提到创建命令时，添加[^1]，因为来自引用[1]。 - 引用[2]可能不直接相关，但如果有peer dependencies问题，可以提及。用户说引用仅供参考，不是真正需求，但我还是应该使用它们如果相关。生成相关问题：类似于示例，添加3个左右的问题。例如： 1. 如何配置UMI项目使用JavaScript？ 2. UMI项目中常见的JavaScript开发技巧？ 3. UMI与TypeScript的区别和优势？确保回答真实可靠。最终回答大纲： - 开头：直接回答问题。 - 步骤： a. 安装Node.js和pnpm（如果未安装）。 b. 运行创建命令：pnpm dlx create-umi@latest my-umi-app - 解释交互式提示，选择JavaScript。 c. 进入目录并安装依赖。 d. 启动开发服务器。 - 可选：处理peer dependencies问题，参考引用[2]。 - 结尾：生成相关问题。在步骤中，自然地添加引用。 </think>### 使用UMI搭建JavaScript模式项目的方法 UMI是一个企业级的前端应用框架，基于React生态系统，支持JavaScript和TypeScript开发。UMI 4提供了简便的脚手架工具来创建项目，您可以通过交互式命令选择JavaScript模式。以下是详细的步骤指南，基于UMI官方文档和最佳实践（引用包括您的参考信息）。整个过程简单易行，只需命令行操作即可完成。 #### 前提条件在开始前，请确保您的系统已安装： - **Node.js** (推荐版本：v16.x 或更高)。如果未安装，请从[Node.js官网](https://nodejs.org/)下载。 - **pnpm** (高性能包管理工具)。安装命令： ```bash npm install -g pnpm ``` 如果已安装，可通过`pnpm -v`检查版本（推荐v7.x或更高）[^1]。 #### 步骤指南 1. **创建UMI项目** 打开命令行终端，切换到您想创建项目的目录（例如`cd ~/projects`），然后执行以下命令： ```bash pnpm dlx create-umi@latest my-umi-app ``` - 此命令使用`create-umi`工具初始化项目（`my-umi-app`是项目名称，可自定义）。 - **关键提示**：在交互式提示中，选择JavaScript模式： - `? Pick template`：选择`React`（UMI默认支持React框架）。 - `? Pick language`：选择`JavaScript`（而非TypeScript）。 - 其他选项（如状态管理库）按需选择；默认配置即可用于JavaScript开发。 - 命令完成后，会自动生成项目结构（包括配置文件如`.umirc.js`和`package.json`）[^1]。 2. **进入项目目录并安装依赖** ```bash cd my-umi-app pnpm install ``` - `pnpm install`会安装所有依赖包。如果遇到peer dependencies警告（常见），可忽略或添加`.npmrc`文件解决： ```bash echo "strict-peer-dependencies=false" > .npmrc ``` 参考提示：这能避免依赖冲突，确保顺利安装[^2]。 3. **启动开发服务器** ```bash pnpm dev ``` - 运行后，UMI会启动本地开发服务器（默认端口8000）。在浏览器中打开`http://localhost:8000`，即可预览JavaScript模式的初始项目页面。 - 修改代码：编辑`src/pages/index.js`文件即可开始JavaScript开发。 #### 项目结构与自定义 - **核心文件**： - `.umirc.js`：UMI配置文件（可自定义路由、插件等）。 - `package.json`：JavaScript依赖管理。 - `src/pages`：存放JavaScript页面文件（例如`index.js`）。 - **JavaScript开发提示**： - UMI默认使用React，因此项目中可使用JSX语法（如`function HomePage() { ... }`）。 - 如需纯JavaScript（无JSX），请通过`.umirc.js`禁用React插件（但较少见，UMI推荐React集成）。 - 更多配置参考[UMI官方文档](https://umijs.org/)。 #### 常见问题解决 - **peer dependencies警告**：如引用[2]所示，添加`.npmrc`文件并设置`strict-peer-dependencies=false`可忽略依赖问题[^2]。 - **项目启动失败**：检查Node.js和pnpm版本是否兼容（推荐Node v16+和pnpm v7+）。通过以上步骤，您可以在10分钟内创建一个完整的UMI JavaScript模式项目。如果您有特定需求（如路由或状态管理），可进一步定制配置文件。