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

【微信小程序】原生微信小程序ts模板下引入vant weapp

news 2025/12/16 2:08:59

之前一直是在普通项目下使用 vant weapp，这不最近学了ts，使用微信开发工具的ts+less初始化项目，再引入 vant 时踩了好久坑，特来记录一下

前言

本文章适合微信开发工具的ts项目，指的是项目目录结构如下图

在这里插入图片描述

总结

从上图可以看到，小程序的ts初始化项目，与之前常见的不同，主要在于 miniprogram外层多了些东西，此时我们在终端里 npm 一下，你会发现 node_modules也是装在外面的。

这其实是正常现象，但当时我对此感到疑惑并认为配置要对此做些改变。。。

没有变！
没有变！
没有变！

我们依然跟着官网走就可以了！

坑在哪里，坑在 我们更改 project.config.json 后，工具无法及时识别，导致构建npm错误

正文

下面跟着我一步一步走

  1. setp1
    在这里插入图片描述步骤一完成后，你的项目应该出现了node_modules，注意位置是在miniprogram外面
    在这里插入图片描述

  2. step2
    在这里插入图片描述这里没啥问题，照做即可

  3. step3

在这里插入图片描述步骤三，照做即可，把红框内的复制黏贴进去，保存

  1. step4
    最重要的来了，此时先别构建npm，要重启微信开发工具，否则会出现上文总结里提到的坑
  2. step5
    在这里插入图片描述重启后，就可以构建npm了，照文档走，构建完成后，应当出现miniprogram_npm，注意位置在miniprogram里面，如果在外面是错误的！！请重新检查project.config.json并重启开发工具
    在这里插入图片描述
  3. step6
    在这里插入图片描述最后一步，跟着文档走

在这里插入图片描述用按钮测试一下，成功！

相关文章：

【微信小程序】原生微信小程序ts模板下引入vant weapp

之前一直是在普通项目下使用 vant weapp，这不最近学了ts，使用微信开发工具的tsless初始化项目，再引入 vant 时踩了好久坑，特来记录一下 前言 本文章适合微信开发工具的ts项目，指的是项目目录结构如下图 总结 从上图…...

编程日记 2023/2/21 21:10:28

Puppeteer之Pyppeteer——自动登录Gmail(6)

前言 本文是该专栏的第6篇，结合项目案例让你熟练使用pyppeteer，后面会持续分享Pyppeteer的干货知识，记得关注。 有同学留言，使用selenium自动登录gmail邮箱，被Google识别为机器人怎么办？出现这个问题，主要在于Google可以检测出selenium的控件，无论你怎么加入规避方法，…...

编程日记 2023/2/21 21:09:20

python 绘图 —— 绘制从顶部向底部显示的柱形图[ax.bar()]

python 绘图 —— 绘制从顶部向底部显示的柱形图[ax.bar()] 效果图如下所示： 就是这个样子，一般比较少见将柱形图从上往下绘制的。可能是会为了更好的展示数据对比结果吧。这里绘图的主要思路如下： 利用ax.twinx()这个函数生成一个新的x轴…...

编程日记 2023/2/21 21:08:15

自定义Task工具，调用系统的IdleHandler方法

1、工具类&#xff0c;调用系统的IdleHandler方法package com.abbi.viewdemo;import android.os.Looper;import android.os.MessageQueue;import java.util.LinkedList;import java.util.Queue;public class DelayTaskDispatcher {private Queue<Task> delayTasks new L…...

编程日记 2023/2/21 21:07:10

生态GEP案例分享

浙江省领导参观德清”两山“平台4月30日上午&#xff0c;浙江省政府参事室一行领导&#xff0c;在德清县副县长陪同下考察当地数据智能运营中心&#xff0c;参观了国内首个县域数字“两山”决策支持平台建设成果。国内生产总值(GDP)&#xff0c;是指按国家市场价格计算的一个国…...

编程日记 2023/2/21 21:06:04

企业级信息系统开发学习笔记1.5 初探Spring AOP

文章目录零、本讲学习目标一、Spring AOP&#xff08;一&#xff09;AOP基本含义&#xff08;二&#xff09;AOP基本作用&#xff08;三&#xff09;AOP与OOP对比&#xff08;四&#xff09;AOP使用方式&#xff08;五&#xff09;AOP基本概念二、提出游吟诗人唱赞歌任务&#…...

编程日记 2023/2/21 21:04:57

Mysql数据库主主从设置

注意&#xff1a;在同一台服务器上部署主从或主主之类的时候&#xff0c;数据库data下有一个auto.cnf里的uuid不能重复。 原则&#xff1a;做同步之前要保证两个数据库数据一致. 锁表操作&#xff1a; FLUSH TABLES WITH READ LOCK; 注&#xff1a;没有锁定主服务器&#xf…...

编程日记 2023/2/21 21:03:53

监管持续，医疗卫生机构如何守好“涉疫”数据安全？

肆虐三年的新冠疫情&#xff0c;影响着全球经济发展、社会正常运行&#xff0c;也成为网络攻击、勒索软件攻击快速增长的温床&#xff0c;“滋生”了一系列网络、数据安全问题&#xff0c;受到各界关注。最近&#xff0c;上线运行三年的 “粤康码”发布公告、官宣部分服务下线&…...

编程日记 2023/2/21 21:02:47

STM32开发（13）----获取唯一设备标识符UID

获取唯一设备标识符UID前言一、什么事UID二、实验过程1.CubeMx配置2.代码实现3.实验结果总结前言 这一章节介绍如何获取STM32芯片中的唯一的ID号的两种方法。 一、什么事UID 在许多项目中&#xff0c;识别设备是必要的。从简单的设备描述到更复杂的设备&#xff0c;如 USB 串…...

编程日记 2023/2/21 21:01:41

华为OD机试 - 最优调度策略（Python） | 机试题+算法思路+考点+代码解析 【2023】

最优调度策略 题目 在通信系统中有一个常见的问题是对用户进行不同策略的调度 会得到不同系统消耗的性能 假设由 N 个待串行用户，每个用户可以使用 A/B/C 三种不同的调度策略 不同的策略会消耗不同的系统资源 请你根据如下规则进行用户调度 并返回总的消耗资源数 规则是：相…...

编程日记 2023/2/21 21:00:35

前端零基础入门-002-集成开发环境

本篇目标 了解市面上常用的前端集成开发环境&#xff08;ide&#xff09;掌握 HBuiberX 的使用&#xff1a;下载安装&#xff0c;新建项目、网页、运行网页。 内容摘要 本篇介绍了市面上流行的几款前端集成开发环境&#xff08;ide&#xff09;&#xff0c;并介绍了 Hbuilde…...

编程日记 2023/2/21 20:59:30

su和sudo的区别

linux中 su和sudo的区别 su和sudo是两个常用的切换到root超级用户命令。功能上类似&#xff0c;但使用上还是有不少差异。 su命令 su是切换到root用户的命令&#xff0c;主要用法如下&#xff1a; su&#xff1a;不带参数直接输入su将切换到root用户&#xff0c;需要输入root…...

编程日记 2023/2/21 20:58:24

【ChatGPT】使用ChatGPT进行51单片机程序编程体验

背景 最近ChatGPT大火&#xff0c;笔者尝试使用它进行了51单片机编程尝试。ChatGPT是一种由OpenAI训练的大型语言模型&#xff0c;具有强大的自然语言处理能力和生成代码的能力。 使用ChatGPT进行51单片机编程&#xff0c;笔者发现它可以帮助开发人员快速生成符合要求的代码&a…...

编程日记 2023/2/21 20:57:17

Docker之路（1.Docker概述、组成以及特点）

1.docker为什么会出现&#xff1f; 一款产品或者项目来说&#xff0c;一般有三个环境&#xff0c;日常/测试环境、预发环境、正式/线上环境 这么多环境&#xff0c;对其环境的配置是十分麻烦的&#xff0c;每一个机器都要部署环境&#xff0c;有的会有集群Redis、Hadoop等&…...

编程日记 2023/2/21 20:56:11

非对称加密算法在android的应用

前言android 系统安全内容总结 4、非对称加密算法应用 主要特性包括secure boot、AVB、OTA包签名、apk签名、apex、ko签名； 除此外上层应用keystore服务、涉及TEEOS非对称算法的功能安全会用到。属于功能安全本章节暂不描述。 4.1、secboot+avb secboot+avb属于安全启动参照…...

编程日记 2023/2/21 20:55:05

51单片机——定时器中断实验，小白讲解，相互学习

定时器介绍 1&#xff0c;CPU时序的有关知识 震荡周期&#xff1a;为单片机提供定时信号的震荡源的周期&#xff08;晶振周期或外加震荡周期&#xff09;。状态周期&#xff1a;2个震荡周期为1个状态周期&#xff0c;用S表示。震荡周期又称S周期或时钟周期。机器周期&#xff…...

编程日记 2023/2/21 20:53:59

什么是循环依赖，spring是如何去解决循环依赖问题的？什么是三级缓存？【spring】

文章目录什么是循环依赖&#xff1f;什么是三级缓存&#xff1f;执行流程什么是循环依赖&#xff1f; 在我们的开发中&#xff0c;会不可避免的遇到Bean之间循环依赖的&#xff0c;所谓循环依赖&#xff0c;就是两个或者两个以上的Bean互相持有对方&#xff0c;这样在程序运行…...

编程日记 2023/2/21 20:52:53

Cron表达式

网上搜一下就有在线生成网站&#xff0c;很方便。 比如&#xff1a;Cron表达式生成器 用途 定时调度任务&#xff0c;比如说服务器、云函数中定时执行脚本函数。 Cron 表达式构成 Cron 表达式是字符串&#xff0c;一般由 6 - 7 个字段构成&#xff0c;空格分隔。每个字段代…...

编程日记 2023/2/21 20:51:47

JavaScript 作用域

作用域是可访问变量的集合。在JavaScript中&#xff0c;能够定义全局作用域或者局部作用域。在 JavaScript 中, 对象和函数同样也是变量。在 JavaScript 中, 作用域为可访问变量&#xff0c;对象&#xff0c;函数的集合。JavaScript 函数作用域: 作用域在函数内修改。JavaScrip…...

编程日记 2023/2/21 20:50:41

Hive内部表与外部表的区别具体说明

目录 1.在/opt/atguigu/目录下&#xff0c;新建两个txt文件 2.在hadoop的web端递归创建一个目录&#xff0c;存储这两个文件 3.查看web端的文件 一、内部表&#xff1a; 1.创建一个内部表&#xff0c;并指定内部表的存储位置 2.查看内部表&#xff0c;内部表中没有数据 …...

编程日记 2023/2/21 20:48:31

23-Oracle 23 ai 区块链表（Blockchain Table）

小伙伴有没有在金融强合规的领域中遇见&#xff0c;必须要保持数据不可变&#xff0c;管理员都无法修改和留痕的要求。比如医疗的电子病历中&#xff0c;影像检查检验结果不可篡改行的&#xff0c;药品追溯过程中数据只可插入无法删除的特性需求&#xff1b;登录日志、修改日志…...

编程新知 2025/12/15 13:10:05

ios苹果系统，js 滑动屏幕、锚定无效

现象&#xff1a;window.addEventListener监听touch无效&#xff0c;划不动屏幕&#xff0c;但是代码逻辑都有执行到。 scrollIntoView也无效。 原因&#xff1a;这是因为 iOS 的触摸事件处理机制和 touch-action: none 的设置有关。ios有太多得交互动作&#xff0c;从而会影响…...

编程新知 2025/12/4 2:37:03

Spring是如何解决Bean的循环依赖：三级缓存机制

1、什么是 Bean 的循环依赖 在 Spring框架中，Bean 的循环依赖是指多个 Bean 之间‌互相持有对方引用‌，形成闭环依赖关系的现象。 多个 Bean 的依赖关系构成环形链路，例如： 双向依赖：Bean A 依赖 Bean B，同时 Bean B 也依赖 Bean A（A↔B）。链条循环： Bean A → Bean…...

编程新知 2025/7/25 1:21:53

纯 Java 项目（非 SpringBoot）集成 Mybatis-Plus 和 Mybatis-Plus-Join

纯 Java 项目&#xff08;非 SpringBoot&#xff09;集成 Mybatis-Plus 和 Mybatis-Plus-Join 1、依赖1.1、依赖版本1.2、pom.xml 2、代码2.1、SqlSession 构造器2.2、MybatisPlus代码生成器2.3、获取 config.yml 配置2.3.1、config.yml2.3.2、项目配置类 2.4、ftl 模板2.4.1、…...

编程新知 2025/9/26 12:26:35

【Nginx】使用 Nginx+Lua 实现基于 IP 的访问频率限制

使用 NginxLua 实现基于 IP 的访问频率限制 在高并发场景下&#xff0c;限制某个 IP 的访问频率是非常重要的&#xff0c;可以有效防止恶意攻击或错误配置导致的服务宕机。以下是一个详细的实现方案&#xff0c;使用 Nginx 和 Lua 脚本结合 Redis 来实现基于 IP 的访问频率限制…...

编程新知 2025/10/22 6:06:44

篇章二 论坛系统——系统设计

目录 2.系统设计 2.1 技术选型 2.2 设计数据库结构 2.2.1 数据库实体 1. 数据库设计 1.1 数据库名: forum db 1.2 表的设计 1.3 编写SQL 2.系统设计 2.1 技术选型 2.2 设计数据库结构 2.2.1 数据库实体 通过需求分析获得概念类并结合业务实现过程中的技术需要&#x…...

编程新知 2025/12/12 6:12:44

多元隐函数 偏导公式

我们来推导隐函数 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​、 …...

编程新知 2025/9/19 5:31:38

qt+vs Generated File下的moc_和ui_文件丢失导致 error LNK2001

qt 5.9.7 vs2013 qt add-in 2.3.2 起因是添加一个新的控件类&#xff0c;直接把源文件拖进VS的项目里&#xff0c;然后VS卡住十秒&#xff0c;然后编译就报一堆 error LNK2001 一看项目的Generated Files下的moc_和ui_文件丢失了一部分&#xff0c;导致编译的时候找不到了。因…...

编程新知 2025/12/1 12:02:39

大模型真的像人一样“思考”和“理解”吗？​

Yann LeCun 新研究的核心探讨&#xff1a;大语言模型&#xff08;LLM&#xff09;的“理解”和“思考”方式与人类认知的根本差异。 核心问题&#xff1a;大模型真的像人一样“思考”和“理解”吗&#xff1f; 人类的思考方式&#xff1a; 你的大脑是个超级整理师。面对海量信…...

编程新知 2025/11/28 20:02:50

TMC2226超静音步进电机驱动控制模块

目前已经使用TMC2226量产超过20K，发现在静音方面做的还是很不错。 一、TMC2226管脚定义说明 二、原理图及下载地址 一、TMC2226管脚定义说明 引脚编号类型功能OB11电机线圈 B 输出 1BRB2线圈 B 的检测电阻连接端。将检测电阻靠近该引脚连接到地。使用内部检测电阻时，将此引…...

编程新知 2025/7/6 6:43:40