[微信小程序] 项目引入vant组件库 npm构建问题 避坑

按照Vant Weapp官网的快速上手,构建npm时发现报错

问题:package.json 未找到

原因:没有初始化npm,所以没生成package.json,npm构建时需要此文件,所以报此错误

解决:在项目根目录里执行 " npm init "

再次构建npm,还会报错,此时按照vant官方文档 再次执行即可:

复制代码
npm i @vant/weapp -S --production

如果还是没有成功,检查两个地方

javascript 复制代码
# 项目根目录下的 app.json 是否删除了这行代码

"style": "v2" // 这行代码要删掉,vant官方文档中解释了具体原因
javascript 复制代码
# 项目根目录下的 project.config.json
"packNpmRelationList": [
  {
    "packageJsonPath": "./package.json",
    "miniprogramNpmDistDir": "./"  // 将这里改成./就行了,程序会自动生成miniprogram
  }
]

至此,问题解决

再次点击 工具 / 构建npm即可

相关推荐
小羊Yveesss1 天前
2026年小程序商城的现状和发展趋势
小程序
Greg_Zhong1 天前
微信小程序如何关闭:当前渲染模式为webview?
微信小程序·微信小程序渲染引擎·渲染引擎需搭配更高基础库
橘子海全栈攻城狮1 天前
【最新源码】养老院系统管理A013
java·spring boot·后端·web安全·微信小程序
智慧景区与市集主理人2 天前
五一市集分账混乱?巨有科技智慧市集小程序实现统一收款、自动分账
大数据·科技·小程序
程序鉴定师2 天前
深圳小程序制作哪家好?2026深度市场分析与选择指南?
大数据·小程序
河北清兮网络科技2 天前
广告联盟全解析:从开发接入到运营优化,多视角拆解流量变现逻辑
小程序·app
计算机学姐2 天前
基于微信小程序的校园失物招领管理系统【uniapp+springboot+vue】
java·vue.js·spring boot·mysql·信息可视化·微信小程序·uni-app
张晓℡¹⁸⁰³⁷¹⁸²⁵⁵⁸2 天前
海外盲盒APP玩法集合,海外盲盒多国语言
小程序·php
互联科技报2 天前
订货商城选择哪个系统操作更简单?2026小白友好型选型指南
小程序
网络点点滴2 天前
NPM的包版本管理
前端·npm·node.js