微信小程序bug:没有找到可以构建的NPM包，请确认需要参与构建的npm在miniprogramroot目录；与app.json: [“usingComponents“][“van-button“]:

目录

错误1：没有找到可以构建的NPM包，请确认需要参与构建的npm在miniprogramroot目录

旧版本

 新版本

错误二：app.json: ["usingComponents"]["van-button"]: "@vant/weapp/button/index" 未找到

错误1：没有找到可以构建的NPM包，请确认需要参与构建的npm在miniprogramroot目录

今天在写微信小程序的时候，在里面引入包的时候，然后构建npm时，报了一个错：没有找到可以构建的NPM包，请确认需要参与构建的npm在miniprogramroot目录。

通过查看vant官方文档：Vant Weapp - 轻量、可靠的小程序 UI 组件库

发现应该是第三步出了问题：

在project.config.json 内添加如下配置，使开发者工具可以正确索引到 npm 依赖的位置。

旧版本

这里如果你是旧版本的微信开发者工具：

这里注意：我的微信开发者工具版本为：（顶部查看）

 在该文件下配置下面的代码

{
  ...
  "setting": {
    ...
    "packNpmManually": true,
    "packNpmRelationList": [
      {
        "packageJsonPath": "./package.json",
        "miniprogramNpmDistDir": "./miniprogram/"
      }
    ]
  }
}

你需要在项目根目录新建一个 miniprogram 文件夹，然后再构建

 构建成功后生成 miniprogram_npm 目录

 新版本

最近下载的版本,miniprogramNpmDistDir配置为'./'即可,如下

{
  ...
  "setting": {
    ...
    "packNpmManually": true,
    "packNpmRelationList": [
      {
        "packageJsonPath": "./package.json",
        "miniprogramNpmDistDir": "./"
      }
    ]
  }
}

同时注意：

在使用微信开发者工具时，经常会遇见一些奇怪的问题，

多执行下面两个操作能解决很多问题。

错误二：app.json: ["usingComponents"]["van-button"]: "@vant/weapp/button/index" 未找到

官方文档：Vant Weapp - 轻量、可靠的小程序 UI 组件库

注意：官方文档已经详细介绍了使用步骤！！！！

在确保自己 npm init 了，也下载了包之后，移除全局配置 "style": "v2"，也引用了包之后。

 依然报错，我的解决方法：将路径删掉，然后一层一层自己手动点出来，通过它的路径提示来写。我之前这一块是直接复制粘贴的其他人的，自己把路径点出来后，再重新编译就不再报错了。

最后：

此处基础库设置为通用版本，会减少一些莫名的bug。