[微信小程序] 项目引入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即可

相关推荐
前端百草阁4 小时前
从npm库 Vue 组件到独立SDK:打包与 CDN 引入的最佳实践
前端·vue.js·npm
夏日米米茶4 小时前
Windows系统下npm报错node-gyp configure got “gyp ERR“解决方法
前端·windows·npm
chaosama5 小时前
微信小程序带参分享、链接功能
微信小程序·小程序
胡西风_foxww5 小时前
微信小程序动态组件加载的应用场景与实现方式
微信小程序·应用·加载·动态组件
蓝胖子的多啦A梦7 小时前
npm : 无法加载文件 C:\Program Files\nodejs\npm.ps1,因为在此系统上禁止运行脚
前端·npm·node.js
ALLSectorSorft8 小时前
上门服务小程序会员系统框架设计
小程序·apache
qziovv9 小时前
Pnpm的使用
npm
甜甜的资料库10 小时前
基于小程序老人监护管理系统源码数据库文档
微信小程序
XI锐真的烦12 小时前
横向对比npm和yarn
前端·npm·node.js
说私域15 小时前
基于定制开发开源AI智能名片S2B2C商城小程序的首屏组件优化策略研究
人工智能·小程序·开源·零售