小猪佩奇.js

闲着没事 使用js 画一个小猪佩奇把

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><canvas id="myCanvas" width="1000" height="1000"></canvas><script src="./drawPig.js"></script>
</body></html>
FunPig();
//小猪佩奇
function FunPig() {var ct = document.getElementById('myCanvas').getContext('2d');ct.beginPath()  //开始ct.lineWidth = "3";ct.strokeStyle = "pink";//起点ct.moveTo(75, 15);         //控制范围  结束//context.quadraticCurveTo(cpx, cpy, x, y);ct.quadraticCurveTo(220, 26, 220, 160);    //第一步ct.moveTo(219, 141);ct.quadraticCurveTo(240, 300, 70, 250);    //第三步//   ct.stroke()ct.moveTo(76, 253);ct.quadraticCurveTo(16, 220, 74, 111);ct.moveTo(73, 112);ct.quadraticCurveTo(60, 112, 31, 83);ct.moveTo(31, 83);ct.quadraticCurveTo(23, 26, 75, 15);ct.moveTo(75, 15);ct.quadraticCurveTo(108, 32, 99, 61);ct.moveTo(99, 61);ct.quadraticCurveTo(66, 101, 31, 81);ct.stroke();//  鼻子的两个孔ct.beginPath();ct.arc(48, 48, 6, 0 * Math.PI, 2.5 * Math.PI);ct.stroke();ct.beginPath();ct.arc(77, 48, 6, 0 * Math.PI, 2.5 * Math.PI);ct.stroke();//耳朵//左耳朵ct.beginPath();ct.moveTo(149, 31);ct.quadraticCurveTo(155, 0, 189, 6);ct.moveTo(189, 6);ct.quadraticCurveTo(188, 30, 170, 44);//右耳朵ct.moveTo(188, 59);ct.quadraticCurveTo(198, 24, 222, 32);ct.moveTo(222, 32);ct.quadraticCurveTo(255, 54, 199, 75);ct.stroke();//嘴巴ct.beginPath();ct.arc(93, 178, 30, 0 * Math.PI, 2.5 * Math.PI);ct.stroke();//眼睛ct.beginPath();ct.strokeStyle = " #BDBDBD";ct.arc(141, 67, 14, 0 * Math.PI, 2.5 * Math.PI);ct.stroke();ct.beginPath();ct.strokeStyle = "#000000";ct.arc(136, 64, 6, 0 * Math.PI, 2.5 * Math.PI);ct.stroke();ct.beginPath();ct.strokeStyle = " #BDBDBD";ct.arc(170, 88, 14, 0 * Math.PI, 2.5 * Math.PI);ct.stroke();ct.beginPath();ct.strokeStyle = "#000000";ct.fillStyle = "#FF0000";ct.arc(165, 87, 6, 0 * Math.PI, 2.5 * Math.PI);ct.stroke();// 粉红嘴腮ct.beginPath();ct.strokeStyle = " #CD8C95";ct.arc(178, 147, 20, 0 * Math.PI, 2.5 * Math.PI);ct.stroke();//身体ct.beginPath();ct.strokeStyle = "red";ct.moveTo(195, 245);ct.quadraticCurveTo(215, 215, 244, 410);ct.moveTo(244, 410);ct.quadraticCurveTo(244, 410, 38, 410);ct.moveTo(38, 410);ct.quadraticCurveTo(11, 410, 76, 251);ct.stroke();//两只手ct.beginPath();ct.strokeStyle = "pink";ct.moveTo(58, 294);ct.quadraticCurveTo(50, 288, 12, 238);ct.moveTo(56, 300);ct.quadraticCurveTo(56, 300, 16, 260);ct.lineTo(3, 269);ct.lineTo(11, 250);ct.lineTo(3, 228);ct.lineTo(15, 241);ct.stroke();//右手ct.beginPath();ct.moveTo(223, 292);ct.quadraticCurveTo(266, 288, 287, 271);ct.moveTo(287, 271);ct.quadraticCurveTo(236, 233, 279, 245);ct.moveTo(279, 245);ct.quadraticCurveTo(255, 200, 295, 247);ct.moveTo(295, 247);ct.quadraticCurveTo(288, 200, 306, 226);ct.moveTo(306, 226);ct.quadraticCurveTo(311, 250, 308, 248);ct.moveTo(308, 248);ct.quadraticCurveTo(344, 200, 334, 245);ct.moveTo(334, 245);ct.quadraticCurveTo(311, 280, 300, 280);ct.moveTo(300, 280);ct.quadraticCurveTo(311, 280, 224, 303);ct.stroke();ct.beginPath();ct.moveTo(94, 409);ct.quadraticCurveTo(94, 409, 96, 451);ct.moveTo(96, 451);ct.quadraticCurveTo(53, 429, 56, 461);ct.moveTo(56, 461);ct.quadraticCurveTo(56, 461, 107, 464);ct.lineTo(106, 409);ct.moveTo(183, 411);ct.lineTo(182, 447);ct.quadraticCurveTo(124, 434, 136, 464);ct.lineTo(196, 463);ct.lineTo(195, 409);ct.stroke();ct.beginPath();ct.lineWidth = "7";ct.strokeStyle = "pink";ct.lineCap = "round";ct.moveTo(238, 360);ct.quadraticCurveTo(266, 380, 267, 360);ct.quadraticCurveTo(254, 330, 250, 380);ct.quadraticCurveTo(254, 420, 290, 369);ct.stroke();}

小猪佩奇出来了 

第二种

纯css

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>用css画一个小猪佩奇</title><style type="text/css">div {position: absolute;transform-origin: left top;}.pig_container {width: 800px;height: 800px;top: 0;left: 50px;}.pig_head {width: 300px;height: 200px;top: 100px;left: 100px;border-radius: 95% 50% 50% 50%/ 87% 80% 68% 50%;border: 6px solid #ef96c2;background-color: #ffb3da;transform: rotate(30deg);z-index: 100;box-sizing: border-box;}.pig_head_white_left_bottom {width: 200px;height: 154px;bottom: -7px;left: -38px;background-color: #fff;box-sizing: border-box;}.pig_head_white_left_top {width: 200px;height: 66px;bottom: 84px;background-color: #ffb3da;box-sizing: border-box;top: 166px;left: 134px;transform: rotate(34deg);z-index: 103;}.left_eye,.right_eye,.face,.mouth {z-index: 104;}.pig_nose {width: 51px;height: 70px;top: 147px;left: 107px;border-radius: 72% 72% 72% 72%/ 72% 72% 72% 72%;border: 6px solid #ef96c2;background-color: #ffb3da;transform: rotate(36deg);z-index: 103;box-sizing: border-box;}.pig_nose_bottom {width: 88px;height: 13px;top: 209px;left: 84px;border-radius: 50% 50% 50% 50%/ 0% 0% 100% 100%;border: 6px solid #ef96c2;background-color: #ffb3da;transform: rotate(35deg);z-index: 102;box-sizing: border-box;border-top-color: #ffb3da;}.pig_jaw {width: 97px;height: 104px;top: 249px;left: 141px;border-radius: 0% 0% 0% 76%/ 0% 0% 0% 74%;border: 6px solid #ef96c2;background-color: #ffb3da;transform: rotate(22deg);z-index: 100;box-sizing: border-box;border-top-color: #ffb3da;border-right-color: #ffb3da;}.pig_jaw_right {width: 13px;height: 6px;background-color: #ef96c2;top: 373px;left: 186px;transform: rotate(19deg);z-index: 100;}.left_eye_bg {width: 29px;height: 29px;top: 177px;left: 170px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;border: 6px solid #fff;background-color: #fff;z-index: 101;box-sizing: border-box;}.left_eye_ball {width: 10px;height: 10px;top: 181px;left: 171px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;border: 6px solid #000;background-color: #000;z-index: 101;box-sizing: border-box;}.left_eye_border {width: 34px;height: 34px;top: 174px;left: 166px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;border: 6px solid #ef96c2;background-color: transparent;z-index: 101;box-sizing: border-box;}.right_eye_bg {width: 28px;height: 28px;top: 194px;left: 205px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;border: 6px solid #fff;background-color: #fff;z-index: 101;box-sizing: border-box;}.right_eye_ball {width: 10px;height: 10px;top: 199px;left: 208px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;border: 6px solid #000;background-color: #000;z-index: 101;box-sizing: border-box;}.right_eye_border {width: 35px;height: 37px;top: 191px;left: 202px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;border: 6px solid #ef96c2;background-color: transparent;z-index: 101;box-sizing: border-box;}.mouth_bottom {width: 97px;height: 45px;top: 273px;left: 154px;border-radius: 50% 50% 50% 50%/ 0% 0% 100% 100%;border: 6px solid #d44b81;background-color: #000;z-index: 101;box-sizing: border-box;transform: rotate(19deg);}.mouth_middle {width: 98px;height: 27px;top: 272px;left: 154px;border-radius: 0% 0% 50% 50%/ 0% 0% 100% 100%;border: 6px solid #d44b81;background-color: #ffb3da;z-index: 101;box-sizing: border-box;transform: rotate(19deg);border-top-color: #ffb3da;}.mouth_top {width: 135px;height: 66px;top: 231px;left: 149px;border-radius: 50% 50% 50% 50%/ 0% 0% 100% 100%;background-color: #ffb3da;z-index: 101;transform: rotate(13deg);}.face {width: 49px;height: 59px;top: 243px;left: 269px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;background-color: #ff96ce;transform: rotate(26deg);}.nose_kong_left {width: 12px;height: 12px;top: 179px;left: 93px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;background-color: #da6c9b;z-index: 104;}.nose_kong_right {width: 12px;height: 12px;top: 182px;left: 109px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;background-color: #da6c9b;z-index: 104;}.ear_left {width: 24px;height: 52px;top: 126px;left: 226px;border: 6px solid #ef96c2;border-radius: 50% 50% 50% 50%/ 35% 40% 50% 50%;background-color: #ffb3da;z-index: 99;transform: rotate(18deg);}.ear_right {width: 24px;height: 52px;top: 150px;left: 280px;border: 6px solid #ef96c2;border-radius: 50% 50% 50% 50%/ 35% 40% 50% 50%;background-color: #ffb3da;z-index: 99;transform: rotate(36deg);}.pig_body_bottom {width: 215px;height: 197px;top: 305px;left: 108px;border: 6px solid #e33b32;border-radius: 50% 50% 50% 50%/ 100% 100% 0% 0%;background-color: #eb5b50;z-index: 99;}.hand_left_middle {width: 78px;height: 12px;top: 432px;left: 63px;border-radius: 100% 100% 100% 17%/ 100% 90% 16% 90%;background-color: #ffbadf;z-index: 99;transform: rotate(-35deg);}.hand_left_top {width: 28px;height: 9px;top: 415px;left: 63px;border-radius: 100% 100% 100% 35%/ 100% 90% 16% 90%;background-color: #ffbadf;z-index: 99;}.hand_left_bottom {width: 20px;height: 9px;top: 420px;left: 93px;border-radius: 60% 59% 65% 90%/ 100% 90% 89% 90%;background-color: #ffbadf;z-index: 99;transform: rotate(98deg);}.hand_right_middle {width: 79px;height: 11px;top: 374px;left: 309px;border-radius: 100% 100% 15% 17%/ 99% 92% 90% 90%;background-color: #ffbadf;z-index: 99;transform: rotate(28deg);}.hand_right_top {width: 28px;height: 10px;top: 397px;left: 350px;border-radius: 100% 100% 15% 17%/ 99% 92% 90% 90%;background-color: #ffbadf;z-index: 99;transform: rotate(-7deg);}.hand_right_bottom {width: 28px;height: 11px;top: 395px;left: 356px;border-radius: 100% 100% 62% 17%/ 99% 92% 90% 90%;background-color: #ffbadf;z-index: 99;transform: rotate(69deg);}.left_foot {width: 11px;height: 52px;top: 507px;left: 175px;border-radius: 100% 100% 100% 100%/ 50% 50% 21% 20%;background-color: #ffbadf;z-index: 99;}.left_shoes {width: 51px;height: 14px;top: 553px;left: 138px;border-radius: 58% 187% 180% 50%/ 130% 123% 113% 100%;background-color: #000;z-index: 99;transform: rotate(0deg);}.right_foot {left: 268px;}.right_shoes {left: 230px;}.pig_shadow {width: 240px;height: 47px;top: 535px;left: 101px;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;background-color: rgba(171, 171, 171, 0.7);transform: rotate(-1deg);}.tail_left {width: 19px;height: 8px;top: 472px;left: 330px;border-radius: 50% 50% 50% 50%/ 0% 0% 100% 100%;transform: rotate(-9deg);background-color: #ffbadf;z-index: 99;}.tail_left_blank {width: 30px;height: 15px;top: 466px;left: 332px;border-radius: 50% 50% 50% 50%/ 0% 0% 100% 100%;transform: rotate(-36deg);background-color: #fff;z-index: 99;}.tail_right {width: 21px;height: 5px;top: 451px;left: 343px;border-radius: 0% 0% 51% 50%/ 0% 0% 100% 100%;transform: rotate(31deg);background-color: #fff;z-index: 99;border: 8px solid #ffbadf;border-top-color: #fff;}.tail_blank {width: 36px;height: 21px;top: 437px;left: 351px;transform: rotate(34deg);background-color: #fff;z-index: 99;}.tail_middle {width: 7px;height: 11px;top: 450px;left: 336px;border: 8px solid #ffbadf;border-radius: 50% 50% 50% 50%/ 50% 50% 50% 50%;background-color: #fff;z-index: 99;}.tail_circle {width: 17px;height: 8px;top: 475px;left: 358px;border-radius: 36% 37% 62% 63%/ 99% 92% 90% 90%;background-color: #ffbadf;z-index: 99;transform: rotate(-40deg);}</style>
</head><body><div class="pig_container"><!-- 尾巴 --><div class="tail_left"></div><div class="tail_right"></div><div class="tail_blank"></div><div class="tail_middle"></div><div class="tail_circle"></div><!-- 底部阴影 --><div class="pig_shadow"></div><!-- 左脚 --><div class="left_foot"></div><div class="left_foot right_foot"></div><!-- 左鞋 --><div class="left_shoes"></div><div class="left_shoes right_shoes"></div><!-- 左手 --><div><div class="hand_left_top"></div><div class="hand_left_bottom"></div><div class="hand_left_middle"></div></div><!-- 身体 --><div class="pig_body_bottom"></div><!-- 右手 --><div><div class="hand_right_top"></div><div class="hand_right_bottom"></div><div class="hand_right_middle"></div></div><!-- 猪头 --><div><!-- 耳朵 --><div class="ear_left"></div><div class="ear_right"></div><div class="pig_head"><div class="pig_head_white_left_bottom"></div></div><div class="pig_head_white_left_top"></div><!-- 鼻子 --><div class="pig_nose"></div><!-- 下巴 --><div class="pig_jaw"></div><div class="pig_jaw_right"></div><div class="pig_nose_bottom"></div><!-- 鼻孔 --><div class="nose_kong_left"></div><div class="nose_kong_right"></div><!-- 左眼 --><div class="left_eye"><div class="left_eye_bg"></div><div class="left_eye_ball"></div><div class="left_eye_border"></div></div><!-- 右眼 --><div class="right_eye"><div class="right_eye_bg"></div><div class="right_eye_ball"></div><div class="right_eye_border"></div></div><!-- 嘴巴 --><div class="mouth"><div class="mouth_bottom"></div><div class="mouth_middle"></div><div class="mouth_top"></div></div><!-- 脸颊 --><div class="face"></div></div></div></body></html>

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

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

相关文章

UDP/TCP协议解析

我最近开了几个专栏&#xff0c;诚信互三&#xff01; > |||《算法专栏》&#xff1a;&#xff1a;刷题教程来自网站《代码随想录》。||| > |||《C专栏》&#xff1a;&#xff1a;记录我学习C的经历&#xff0c;看完你一定会有收获。||| > |||《Linux专栏》&#xff1…

Elasticsearch:跨集群使用 ES|QL

警告&#xff1a;ES|QL 的跨集群搜索目前处于技术预览阶段&#xff0c;可能会在未来版本中更改或删除。Elastic 将努力解决任何问题&#xff0c;但技术预览中的功能不受官方 GA 功能的支持 SLA 约束。 使用 ES|QL&#xff0c;你可以跨多个集群执行单个查询。 前提&#xff1a; …

实战解读:Llama Guard 3 Prompt Guard

前序研究&#xff1a;实战解读&#xff1a;Llama 3 安全性对抗分析 近日&#xff0c;腾讯朱雀实验室又针对 Llama 3.1 安全性做了进一步解读。 2024年7月23日晚&#xff0c;随着Llama3.1的发布&#xff0c;Meta正式提出了“Llama系统”的概念&#xff0c;通过系统级的安全组件对…

谷粒商城实战笔记-62-商品服务-API-品牌管理-OSS整合测试

文章目录 一&#xff0c;Java中上传文件到阿里云OSS1&#xff0c;整合阿里云OSS2&#xff0c;测试上传文件 二&#xff0c;Java中整合阿里云OSS服务指南引言准备工作1. 注册阿里云账号2. 获取Access Key3. 添加依赖 实现OSS客户端1. 初始化OSSClient2. 创建Bucket3. 上传文件4.…

自定义 RAG 工作流:在 IDE 中结合 RAG 编排,构建可信的编码智能体

构建编码智能体并非一件容易的事。结合我们在 AutoDev、ArchGuard Co-mate、ChocoBuilder 等智能体项目的经验&#xff0c;我们开始思考在 Shire 语言中提供一种新的 RAG 工作流。结合我们先前构建的 IDE 基础设施&#xff08;代码生成、代码校验、代码执行等接口&#xff09;&…

基于PaddleClas的人物年龄分类项目

目录 一、任务概述 二、算法研发 2.1 下载数据集 2.2 数据集预处理 2.3 安装PaddleClas套件 2.4 算法训练 2.5 静态图导出 2.6 静态图推理 三、小结 一、任务概述 最近遇到个需求&#xff0c;需要将图像中的人物区分为成人和小孩&#xff0c;这是一个典型的二分类问题…

Leetcode3219. 切蛋糕的最小总开销 II

Every day a Leetcode 题目来源&#xff1a;3219. 切蛋糕的最小总开销 II 解法1&#xff1a;贪心 谁的开销更大&#xff0c;就先切谁&#xff0c;并且这个先后顺序与切的次数无关。 代码&#xff1a; /** lc appleetcode.cn id3219 langcpp** [3219] 切蛋糕的最小总开销 I…

【SQL 新手教程 1/20】SQL语言MySQL数据库 简介

&#x1f497; 什么是SQL&#xff1f;⭐ (Structured Query Language) 结构化查询语言&#xff0c;是访问和处理关系数据库的计算机标准语言 无论用什么编程语言&#xff08;Java、Python、C……&#xff09;编写程序&#xff0c;只要涉及到操作关系数据库都必须通过SQL来完成 …

4招清洁法,清理电脑无死角,焕然一新效率高

随着时间的积累&#xff0c;电脑内部可能会堆积起大量的垃圾文件、缓存数据和无用程序。因此&#xff0c;定期清理电脑是很有必要的。为了让你的电脑重新焕发生机&#xff0c;提高工作效率&#xff0c;本文将为你介绍4招实用的清洁法&#xff0c;助你轻松清理电脑死角&#xff…

JavaWeb学习——请求响应、分层解耦

目录 一、请求响应学习 1、请求 简单参数 实体参数 数组集合参数 日期参数 Json参数 路径参数 总结 2、响应 ResponseBody&统一响应结果 二、分层解耦 1、三层架构 三层架构含义 架构划分 2、分层解耦 引入概念 容器认识 3、IOC&DI入门 4、IOC详解 …

Cadence23学习笔记(十四)

ARC就是圆弧走线的意思&#xff1a; 仅打开网络的话可以只针对net进行修改走线的属性&#xff1a; 然后现在鼠标左键点那个走线&#xff0c;那个走线就会变为弧形&#xff1a; 添加差分对&#xff1a; 之后&#xff0c;分别点击两条线即可分配差分对&#xff1a; 选完差分对之后…

微服务实践和总结

H5原生组件web Component Web Component 是一种用于构建可复用用户界面组件的技术&#xff0c;开发者可以创建自定义的 HTML 标签&#xff0c;并将其封装为包含逻辑和样式的独立组件&#xff0c;从而在任何 Web 应用中重复使用。 <!DOCTYPE html> <html><head…

【vue3|第18期】Vue-Router路由的三种传参方式

日期:2024年7月17日 作者:Commas 签名:(ง •_•)ง 积跬步以致千里,积小流以成江海…… 注释:如果您觉得有所帮助,帮忙点个赞,也可以关注我,我们一起成长;如果有不对的地方,还望各位大佬不吝赐教,谢谢^ - ^ 1.01365 = 37.7834;0.99365 = 0.0255 1.02365 = 1377.408…

unity2D游戏开发01项目搭建

1新建项目 选择2d模板,设置项目名称和存储位置 在Hierarchy面板右击&#xff0c;create Empty 添加组件 在Project视图中右键新建文件夹 将图片资源拖进来&#xff08;图片资源在我的下载里面&#xff09; 点击Player 修改属性&#xff0c;修好如下 点击Sprite Editor 选择第二…

Angular由一个bug说起之八:实践中遇到的一个数据颗粒度的问题

互联网产品离不开数据处理&#xff0c;数据处理有一些基本的原则包括&#xff1a;准确性、‌完整性、‌一致性、‌保密性、‌及时性。‌ 准确性&#xff1a;是数据处理的首要目标&#xff0c;‌确保数据的真实性和可靠性。‌准确的数据是进行分析和决策的基础&#xff0c;‌因此…

【数据结构】建堆算法复杂度分析及TOP-K问题

【数据结构】建堆算法复杂度分析及TOP-K问题 &#x1f525;个人主页&#xff1a;大白的编程日记 &#x1f525;专栏&#xff1a;数据结构 文章目录 【数据结构】建堆算法复杂度分析及TOP-K问题前言一.复杂度分析1.1向下建堆复杂度1.2向上建堆复杂度1.3堆排序复杂度 二.TOP-K问…

深度学习1-简介

人工智能&#xff08;AI&#xff09;旨在打造模仿智能行为的系统。它覆盖了众多方法&#xff0c;涵盖了基于逻辑、搜索和概率推理的技术。机器学习是 AI 的一个分支&#xff0c;它通过对观测数据进行数学模型拟合来学习决策制定。这个领域近年来迅猛发展&#xff0c;现在几乎&a…

​ ​【Linux】-----工具篇(多模式编辑器vim介绍及配置)

目录 认识常用三种模式 基本操作 Ⅰ、进入/打开vim Ⅱ、模式转换 Ⅲ、退出vim 命令集 Ⅰ、命令模式下 移动光标 删除文字 复制 替换 撤销 批量化注释 批量化去注释 Ⅱ、底行模式下 列出行号 跳转至指定行 查找字符 保存文件 退出vim 查看文件 分屏操作 vim的简…

论文阅读:面向自动驾驶场景的多目标点云检测算法

论文地址:面向自动驾驶场景的多目标点云检测算法 概要 点云在自动驾驶系统中的三维目标检测是关键技术之一。目前主流的基于体素的无锚框检测算法通常采用复杂的二阶段修正模块,虽然在算法性能上有所提升,但往往伴随着较大的延迟。单阶段无锚框点云检测算法简化了检测流程,…

微信小程序:vant-weapp 组件库、css 变量

vant-weapp 组件库 前往 vant-weapp 官网 npm 使用限制&#xff1a;不支持依赖于 Node.js 内置库、浏览器内置对象、C 插件 的包。 安装 vant-weapp # 通过 npm 安装 npm i vant/weapp -S --production# 通过 yarn 安装 yarn add vant/weapp --production# 安装 0.x 版本 npm i…