微信小程序使用vant组件所出现的一些问题

这篇具有很好参考价值的文章主要介绍了微信小程序使用vant组件所出现的一些问题。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

我在第一次使用vant小程序组件时,出现了不少问题

首先,我是跟随官方文档一步一步来做的,但当我构建npm时发生了一些报错

1.发生错误 Error: C:\Users\86198\WeChatProjects\miniprogram-1\package.json 未找到

2.发生错误 Error: C:\Users\86198\WeChatProjects\miniprogram-1\package.json 对应的 node_modules 不存在,请在 C:\Users\86198\WeChatProjects\miniprogram-1 执行 `npm install`

3.发生错误 Error: C:\Users\86198\WeChatProjects\miniprogram-1\miniprogram-1\ 未找到

首先第一个与第二个都是npm安装依赖未生成相关文件:我在开发者工具内使用npm install安装依赖时,文件内部却不生成相关的package.json文件和node_modules目录,这原因还未找出,但可以使用其他方法手动生成:

1. 确保你在正确的目录下:确认你当前所在的目录是你的小程序项目的根目录,即包含app.json和project.config.json等文件的目录。

2. 使用npm初始化项目:在命令行终端中,进入你的小程序项目根目录,并执行以下命令来生成package.json文件:
   ```
   npm init
   ```
   这将会引导你填写一些基本信息,如项目名称、版本号等。你可以按照提示进行填写,或者直接按回车键接受默认值。

3. 完成上述步骤后,你的小程序项目根目录应该会生成一个新的package.json文件。

确保你遵循了以上步骤并正确生成了package.json文件。如果问题仍然存在,请确保你的小程序项目结构正确,并且package.json文件位于项目的根目录下。

第三个是在根目录中,文件project.config.json内, "setting"对象中添加,注意,这个与官方配置有些不同,本身这个对象"miniprogramNpmDistDir":"./",的属性值是有个地址的,但是我的第三个问题所提示的错误就是找不到路径,多了一层,这个根据 自身情况,如果加上路径报错,那就换成“./”路径。

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

希望对大家有所帮助!文章来源地址https://www.toymoban.com/news/detail-818623.html

到了这里,关于微信小程序使用vant组件所出现的一些问题的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 原生微信小程序使用 wxs;微信小程序使用 vant-weapp组件

    在这里插入图片描述 操作顺序 :文档地址 如果使用 typescript 需要操作步骤3,否则不需要操作 2.1 在根目录下 操作 2.2 安装版本 2.3 构建包 - 详情-勾选使用 npm 2.4 使用 vant 组件

    2024年02月11日
    浏览(42)
  • 微信小程序中使用vant组件库(超详细)

    Vant是一个轻量、可靠的移动端组件库,于2017年开源。目前Vant官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本,并由社区团队维护 React 版本和支付宝小程序版本。 微信小程序版本的Vant组件库是 Vant Weapp ,其官方文档是 https://youzan.github.io/vant-weapp/#/home 我们废话不多说,直

    2024年02月02日
    浏览(34)
  • 微信小程序安装和使用 Vant Weapp 组件库

    Vant 是一个轻量、可靠的移动端组件库,于 2017 年开源。 目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本,并由社区团队维护 React 版本和支付宝小程序版本。 在小程序项目上安装Vant Weapp,(你的电脑应该有npm环境才行)。 win + R 输入 npm -version 查看一下 如果没有

    2024年02月16日
    浏览(30)
  • 微信小程序使用vant组件样式未生效解决办法

    1.删除小程序自带的样式 首先在app.json里面删除这一行 2.清除缓存 重新编译   3.重新构建npm 重新编译 在工具里面  

    2024年02月15日
    浏览(26)
  • 微信小程序在使用vant组件库时构建npm报错

    在跟着vant官方进行使用步骤一步步操作时,由于要构建NPM,但NPM包在App配置文件的外部 所以在做下图这一步时: 接着再进行npm构建时会报错 解决方法 :修改

    2024年02月13日
    浏览(27)
  • 解决微信小程序vant weapp组件库时间选择器只显示年year的问题 vant weapp版本1.10.5

    当今网上十篇文章九个抄,抄的还都是远古文章,完全不适用现在的版本,故于2023.3.10日,出一篇现vant weapp版本1.10.5的时间选择器只显示year模式的需求,解决官方无法显示只带有年份year的时间选择器问题 找到时间选择器文件,修改datetime-picker/index.js源码 1. 先让面板支持只

    2024年02月12日
    浏览(26)
  • 微信小程序使用vant组件的输入框搭配弹层选择器注意事项

    先看下页面代码: wxml js 效果: 点击: 选完确认: 在做这个效果的时候,输入框 van-field 必须得加入 readonly 这个只读属性,不然会导致用户手机触发默认键盘遮挡你的弹窗和选择器内容影响体验. 也不要用 disabled 来禁用输入框,样式会变成禁用状态下的样式很难改动,只需要设置为只

    2024年02月11日
    浏览(39)
  • 微信小程序——使用 Vant 组件实现 Popup 弹出层(各位置弹出详细代码分享)

    ✅作者简介:2022年 博客新星 第八 。热爱国学的Java后端开发者,修心和技术同步精进。 🍎个人主页:Java Fans的博客 🍊个人信条:不迁怒,不贰过。小知识,大智慧。 💞当前专栏:微信小程序学习分享 ✨特色专栏:国学周更-心性养成之路 🥭本文内容:微信小程序——使

    2024年02月08日
    浏览(37)
  • 微信小程序使用vant calendar日历组件 default-date 默认选中的日期无效?

    废话少说 直接贴代码 总结:  ①: 要有一个minDate 最小可选日期,要不然无法选择之前的时间 ②: defaultDate(数组): 绑定为时间戳,,[ 起始时间,截止时间 ] , 转换时间戳时要再次getTime()否则设定默认时间失败!!!重点!!!

    2024年02月02日
    浏览(35)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包