微信小程序 npm 导入vant weapp 提示未找到npm包入口文件

最新推荐文章于 2023-05-17 09:15:23 发布
最新推荐文章于 2023-05-17 09:15:23 发布
阅读量3.9k 收藏 3
点赞数 1
分类专栏： 微信小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/CodeMJ/article/details/109357806
版权

npm包导入步骤

1、微信小程序空白地方右键 → 在外部终端窗口打开

2、输入 npm init -y 然后回车

3、输入npm i @vant/weapp -S --production 然后回车

4、工具 → 构建npm时提示以下错误：未找到npm包入口文件

解决方案1：步骤3改为 npm i vant-weapp -S --production，但是这个会改变目录结构，vant官方结构为@vant/weapp，这个会变成vant-weapp，后续引入组件时，都要修改目录，不能直接参照vant weapp官网文档，建议使用解决方案2


解决方案2：删掉截图中的文件夹，然后重新构建npm即可

CodeMJ
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信小程序npm引入vant-weapp的踩坑记录
10-16
主要给大家介绍了关于微信小程序npm引入vant-weapp的踩坑记录，文中通过示例代码介绍的非常详细，对大家学习或者使用微信小程序具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
微信小程序 构建npm报错： 没有找到可以构建的 NPM 包，请确认需要参与构建的 npm 都在 `miniprogramRoot` 目录内，
苦夏木禾
06-01 924
微信小程序 构建npm报错： 没有找到可以构建的 NPM 包，请确认需要参与构建的 npm 都在 `miniprogramRoot` 目录内，
微信小程序使用Vant Weapp组件库的方法步骤
12-11
地址：https://youzan.github.io/vant/#/zh-CN/intro 一.引入Vant组件库 1.首先运行 npm init 就会生成 package.json 2.运行 npm i vant-weapp -S --production     3.安装成功后 点击 工具 => 构建npm 之后点击 详情 => 使用构建npm 渲染 二.使用组件库 首先在json文件中引入组件 “van-button”: “vant-weapp/button” 之后可以在官网找到想要用的组件使用     报错码 VM292:1 thirdScriptError sdk
微信小程序引入vant-weapp
01-03
选择位置新建项目，本文直接在桌面新建项目 1 在桌面新建demo文件夹，然后打开微信开发者工具，选择demo文件夹新建小程序项目 2 用cmd或者powershell找到该项目目录，在该目录下进行安装vant-weapp 步骤一 通过 npm 安装 # 通过 npm 安装 npm i @vant/weapp -S --production # 通过 yarn 安装 yarn add @vant/weapp --production # 安装 0.x 版本 npm i vant-weapp -S --production  3 构建npm包 步骤二 构建 npm 包 打开微信开发者工具，点击 
微信小程序使用npm包的方法步骤
12-11
一：npm初始化 如果你的小程序项目没有安装过npm包的话，你需要先初始化npm npm init 二：安装npm包 这里以vant-weapp(小程序UI组件库)为例： npm i vant-weapp -S --production 三：npm包构建 1：点击微信开发者工具右上角详情——>本地设置，选中使用npm模块 2：点击微信开发者工具菜单栏的工具，选择构建npm 当显示如下表示npm构建成功，构建完成就可以使用npm包了 npm包构建完成之后项目的结构如下： 四：使用npm 1：js中引入npm包 const myPackage = require('packageNa
[wechat]iniprograms index.js: 未找到npm包入口文件
qubes的专栏
10-18 387
operation 引入vant-weapp：npm i @vant/weapp -S --production 小程序：工具-npm构建 error /…/miniprogram/node_modules/@types/wechat-miniprogram/index.js: 未找到npm包入口文件 reason 使用npm i vant-weapp -S --production会改变目录结构 solution 手动删除node_modules下的@types整个文件夹，然后再用工具 → 构建npm
@types/wechat-miniprogram/index.js 未找到npm包入口文件？
Reid的专栏
11-03 1573
使用npm i vant-weapp -S --production会改变目录结构，我是通过npm i @vant/weapp -S – production构建以后，删除node_modules下的@types整个文件夹，然后再用工具 → 构建npm的 参考：https://developers.weixin.qq.com/community/develop/doc/0006285df40970c3ac2bf536c51400 ...
小程序构建npm包，提示npm构建未找到npm包入口文件
weixin_49261425的博客
02-18 2871
1. 进入小程序根目录：C:\Users\Administrator>cd C:\Users\Administrator\Desktop\ml 输入npminit 过程中全部回车就好！ 2.安装你需要的内容npm i @vant/weapp -S --production 3.勾选以下内容： 工具>构建npm 以上就是完成了所有步骤 如果按照以上步骤，提示npm构建未找到npm包入口文件，则： 1. 先把 package-lock.json,package.jso...
微信小程序构建npm失败，提示npm构建未找到npm包入口文件
紫蝶侠的博客
05-17 902
【代码】微信小程序构建npm失败，提示npm构建未找到npm包入口文件。
\node_modules\@types\node\index.js: 未找到npm包入口文件的解决办（棒）法
泥鸽鸽的博客
12-23 1759
问题： C:\Users\LIFETIME\WeChatProjects\ticket\node_modules@types\node\index.js: 未找到npm包入口文件 C:\Users\LIFETIME\WeChatProjects\ticket\node_modules\weui-wxss\dist\app.wxss.js: 未找到npm包入口文件 解决方法： 1、先把 packagelock.json,package.json,node_modules,miniprogram_npm都删干
微信小程序使用 vant 时，遇到的一些坑
Xpy 的博客
05-07 3032
# 通过 npm 安装 npm i @vant/weapp -S --production npm init -f
使用Vant 组件 [“usingcomponents“][“van-button“]: “@vant/weapp/button/index“ 未找到：
fghfghhgjgj的博客
01-14 1万+
这个问题困扰了我很久。 “未找到”，其实就是路径不对。 总结一下使用vant weapp的步骤。 第一步：在node中文网，下载并安装Node。 将node加入环境变量。 第二步：检查node是否安装成功。 win+R，cmd，输入命令：node -v，或者npm -v，只要显示版本号就可以了。 第三步：新建一个小程序。名字不要用中文的。 在小程序根目录，打开命令行窗口。 输入命令： npm init -y //-y的意思是，一直按 yes ,就是enter键。 npm i @vant/weapp -S
Component is not found in path “npm/taro-ui/dist/weapp/components/icon/index“解决
qq_34611950的博客
12-08 1298
production 模式下 taro-ui 组件代码被当成副作用移除了， 可以加上 sideEffect 配置来解决 在project.config.json文件中修改：主要是mini{}里的内容 module.exports = { env: { NODE_ENV: '"production"' }, defineConstants: { }, mini: { webpackChain(chain) { chain.optimization.side
“@vant/weapp/loading/index“ 未找到(env: Windows,mp,1.05.2204180； lib: 2.26.0)
m0_46106931的博客
03-19 747
vant组件库发地安装与使用
【微信小程序】微信开发者工具 引用 vant-weapp时“miniprogram/node_modules/@babel/runtime/index.js: 未找到npm包入口文件” 解决办法
amoureux555的博客
07-10 2179
“miniprogram/node_modules/@babel/runtime/index.js: 未找到npm包入口文件
关于Vant Weapp中组件引入未找到的解决方案
热门推荐
佐斌的笔记簿
07-06 1万+
在开发微信小程序时，需要引入一些第三方UI库，这时就需要用到微信小程序的 UI，分享一些遇到的问题 Vant Weapp框架引入组件失败问题: 使用Vant 组件 [“usingcomponents”][“van-button”]: “@vant/weapp/button/index” 未找到： 当出现: vm192:2 miniproject/app.json: ["usingcomponents"]["van-button"]: "@vant/weapp/button/index" 未找到 解决方案
微信小程序引入vant与解决[ app.json 文件内容错误] [“van-button“]: “@vant/weapp/button/index“ 未找到
Fanqie_KK的博客
05-19 5676
下面模拟小白引入vant所遇到的问题与[ app.json 文件内容错误] ["van-button"]: "@vant/weapp/button/index" 未找到 1，利用npm引入vant组件，在目录下初始化组件库 命令：npm init 按ENTER键直到最后回yes好了 2，npm i vant-weapp -S --production 3，回到小程序构建npm 4，此时可能会出现这样的一个问题说没有找到可构建的npm的包 5，你回到miniprog.
微信小程序 引用 vant-weapp 没有找到 node_modules 目录 解决办法
iotjin的专栏
09-21 1万+
一、cmd 打开终端， cd到项目路径下，执行下面几步 1、（初始化npm项目）：npm init 2、（生成package-lock.json，记录使用的第三方插件）：npm install --production 3、（引入第三方组件 有赞）： npm i vant-weapp -S --production 第1步操作后一直按回车，直到...
微信小程序引入vant-weapp后出现[‘vant-XXX‘]:‘@vant/weapp/xxx‘未找到，错误解决
weixin_44375583的博客
09-04 1880
vant-xxx组件未找到的错误解决
ts版微信小程序 安装引入vant/weapp
最新发布
06-12
好的，针对你的问题，我可以给出一些安装和引入 Vant Weapp 组件库的步骤。请按照以下步骤操作： 1. 安装 Vant Weapp 组件库： ``` npm install vant-weapp -S --production ``` 2. 在 `app.json` 中全局引入 Vant Weapp 组件： ``` { "pages": [ // ... ], "window": { // ... }, "usingComponents": { // 引入 Vant Weapp 组件 "van-button": "vant-weapp/dist/button/index", "van-cell": "vant-weapp/dist/cell/index", "van-cell-group": "vant-weapp/dist/cell-group/index", // ... } } ``` 3. 在页面中使用 Vant Weapp 组件： ``` <van-button type="primary">按钮</van-button> <van-cell title="单元格" value="内容"></van-cell> <van-cell-group> <van-cell title="单元格" value="内容"></van-cell> <van-cell title="单元格" value="内容"></van-cell> </van-cell-group> // ... ``` 注意：以上是一些基本的使用方法，更多的组件和 API 请参考 Vant Weapp 的官方文档。另外，如果你使用 TypeScript 开发微信小程序，可以在对应页面的 `.ts` 文件中引入对应的组件，如下所示： ``` // 引入 vant-weapp 组件 import { Button } from 'vant-weapp'; // 使用 vant-weapp 组件 Button({ type: 'primary', text: '按钮', bindclick: 'handleClick' }); // ... ``` 希望这些步骤能够帮助到你。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值