【微信小程序开发】Nodejs npm的安装与微信小程序适配以使用VantWeapp与配置npm遇到的问题

已于 2023-03-31 15:53:04 修改
阅读量1k 收藏 9
点赞数
分类专栏： 微信小程序开发 文章标签： 微信小程序 npm 小程序
于 2023-03-31 14:56:42 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Elephant_King/article/details/129879725
版权

Nodejs与npm安装

首先进入官网安装Node.js 中文网

在这里插入图片描述
按照自己的版本安装，安装完Nodejs后会自动安装npm，在终端输入可以看到安装的版本

node -v
npm -v

在这里插入图片描述
打开微信小程序，在调试器中新建终端并输入

npm i @vant/weapp -S --production

在这里插入图片描述
生成这个文件夹后便成功安装
在这里插入图片描述

VantWeapp网站

然后按照官网配置
在这里插入图片描述
会出现飘红
在这里插入图片描述
这里代表上面已经有一个packNpmRelationList了，这里名称重复
在这里插入图片描述

npm构建报错

但是还是会产生报错
在这里插入图片描述
这里我们需要将packNpmRelationList中的地址从./miniprogram/改为./node_modules
在这里插入图片描述

然后清除一下缓存
在这里插入图片描述
便可以成功构建npm
在这里插入图片描述

找不到@vant/weapp/button/index

在终端输入npm init -y
在这里插入图片描述
然后重新构建一下就好了

Elephant_King
关注
  • 0
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信小程序通过nodejs云函数解密获得微信步数源码
04-27
微信小程序是一种轻量级的应用开发平台，它允许开发者在微信内构建丰富的互动体验。在这个场景中，我们将探讨如何利用Node.js云函数来解密微信小程序中的encryptedData，从而获取用户的微信步数数据。 首先，我们...
微信小程序+Nodejs项目实战合集
04-03
微信小程序+Nodejs项目实战合集 内含两套完整实战教你全为了解一个小程序的开发流程及步骤
nodejs实现微信小程序
LUANGhuan110的博客
09-20 1571
nodejs实现微信小程序登陆
微信开发者工具安装和配置node.js教程
token_10的博客
02-08 5438
解决微信开发者工具内建终端无法使用npm命令的问题。
微信云函数相关的Node.js部署
最新发布
weixin_53483426的博客
05-21 243
我在Windows下用微信小程序开发工具开发的Node.js云函数，需要引用“const cloud = require('wx-server-sdk')”，按照文档说明，需要在本地安装Node.js并用npm安装” wx-server-sdk”。如果不安装Node.js并安装引用的sdk库（我引用了” wx-server-sdk”），部署云函数时会报错。本文介绍了node.js的部署过程。
微信小程序搭载node.js服务器（简）
灵魂学者的博客
04-17 1万+
微信小程序快速搭载node.js服务器，适合新手使用。
微信小程序使用Node.js实现的简单的服务器聊天功能
lin8705600H的博客
05-22 650
（node.js安装到官网安装即可，将对应准备好的服务器文件放置在文件夹中，cd进入文件夹）首先启动node.js服务。
关于微信小程序安装npm的过程，从下载到小程序内部安装完成
m0_72190449的博客
11-13 4183
1.先从官网下载nodejs 网站为Node.js (nodejs.org)，选择左边第一个2 然后一直next，选默认就行 选择自己喜欢的路径我的是D:\nodejs-v18.12.1 3 下载完成后，先在安装文件夹中新建两个文件夹 node_cache node_global 4 配置一下环境变量，如果不配置好就会导致微信微信小程序里面找不到路径的情况，打开控制面板->系统与安全->系统->高级系统设置->环境变量 一共要配置三个地方 一个是
基于微信小程序+Nodejs的学习资料销售平台毕业设计(源码+数据库+说明).rar
06-29
基于微信小程序+Nodejs的学习资料销售平台毕业设计(源码+数据库+说明).rar 【项目技术】 微信开发者工具+nodejs+mysql 【实现功能】 系统的主要功能包括：首页、个人中心、用户管理、资料类型管理、学习资料管理、...
微信小程序基于Nodejs和Vue3开发的外卖点餐系统源码+sql数据库(课程设计).zip
01-11
1.项目代码功能经验证ok，确保稳定可靠运行。欢迎下载使用！ 2.主要针对各个计算机相关专业，包括计科、信息安全、数据科学与大数据技术...微信小程序基于Nodejs和Vue3开发的外卖点餐系统源码+sql数据库(课程设计).zip
java-微信小程序-NodeJS西餐外卖系统的设计与实现源码
04-07
微信小程序-NodeJS西餐外卖系统 项目关键技术 开发工具：IDEA 、Eclipse 编程语言: Java 数据库: MySQL5.7+ 框架：ssm、Springboot 前端：Vue、ElementUI 关键技术：springboot、SSM、vue、MYSQL、MAVEN 数据库工具...
新星计划｜记录安装Nodejs和HBuilderX搭建、部署微信小程序开发环境（一）
Senoh的博客
05-16 1405
1 前言 2 注册小程序账号 3 安装微信开发者工具 4 安装Nodejs和HBuilderX 4.1 windows用户安装Nodejs 4.2 macos/linux用户安装Nodejs 4.3 安装HBuilder X 5 创建项目 5.1 新建一个项目 5.2 进行基本配置 6 HBuilderX同步微信开发者工具 6.1 打开服务端口 6.2 调用微信开发者工具
微信小程序项目使用npm安装vant-weapp的正确步骤及错误处理方法
热门推荐
zxh7770的博客
03-26 2万+
微信小程序项目使用npm安装vant-weapp的正确步骤及错误处理方法 1，搭建小程序 1.1 项目 - 新建项目 - 如下图所示： 1.2点击图中“新建”即可创建成功小程序项目。 2，安装vant- weapp库 2.0 - 在安装vant- weapp之前我们需要先初始化npm，然后在安装vant- weapp； 2.1 - 使用cmd命令行进入项目根目录，在项目根目录下面初始化npm ...
微信小程序开发工具与Node.js的安装
weixin_40055163的博客
01-01 5101
1 安装 1.1 下载与安装微信开发工具 1.下载的链接如下: https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html 如图所示：说明下载成功！ 2.选中，点击右键“以管理员算法运行”，如图所示: 3.进入欢迎界面点击下一步，即可！ 4.点击我接受，如图所示： 5.修改路径，点击安装。如图所示： 6.点击完成即可，如图所示： 7.使用自己微信扫描登录，如图所示： 8.登录之后会进入到如图所示的界面： 1.2
微信小程序npm安装，保姆级图文教程，步骤齐全
qq_66364610的博客
07-15 3390
Ps:项目名字不能有中文，如果有中文的话输入英文，然后一直回车看到看到Is this OK？如果没有中文同理一直回车就好。然后看到生成了一个package.json的文件。然后点击工具-->构建npm，即完成。
微信开发者工具 构建npm包
路虽远行则将至，事虽难做则必成。
02-16 2510
这几天在学习小程序的时候发现微信开发者工具构建npm包失败，在这里记录一下解决方案首先明白package.json与package-lock.json有什么区别，怎么构建和有什么用微信开发者版本更新原因没有miniprogram文件目录，和本地npm包构建选项（新版本不用选找不到）微信开发者工具也会有很多bug，会编译出错，所以会使用Hb开发原因package.json与package-lock.json区别vue的package.json与package-lock.json有什么区别？
【微信小程序】小程序开发—node.js下载，npm配置以及组件使用
m0_56259342的博客
12-27 1万+
微信小程序用node中npm安装vant组件
微信小程序引入node_modules依赖
abccbatqw的博客
11-27 2107
最后removed 181 packages in 2m是应为之前在calendar_1下就有node_modules。微信小程序不支持直接读取node_modules。首先在目录文件夹下cmd输入npm init命令。以上为cmd下操作过程，基本一路enter即可。
微信小程序开发教程：用nodejs从mysql获取一组数据，全部展现到微信小程序。数据交互保姆级教程
qq_25501981的博客
12-03 2376
目前这些就是基本的从mysql数据库中获取数据后，展示到微信小程序前端的方法，至于我后面写的 wx:for="{{ imgPaths[index] }}" 和 wx:for="{{ commentListzy[item.iddt] }}" ，我下次教大家。
uniapp开发微信小程序使用Nodejs
06-03
在使用Uniapp开发微信小程序时，如果需要使用Node.js，可以通过以下步骤实现： 1. 在服务器上使用Node.js搭建后端服务，提供API接口服务。可以使用Express框架或其他Node.js框架。 2. 在微信小程序中使用uni....

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值