微信小程序如何通过npm安装组件库

最新推荐文章于 2024-09-27 19:56:34 发布
最新推荐文章于 2024-09-27 19:56:34 发布
阅读量1.6k 收藏
点赞数
分类专栏： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/guairena/article/details/115864466
版权

微信小程序中引入组件库vant

1、安装npm包 微信开发文档

在小程序项目的目录下打开终端，执行命令
npm install
在这里插入图片描述

2、安装组件库

npm i @vant/weapp -S --production

3、构建npm

点击开发者工具中的菜单栏：工具–>构建npm
在这里插入图片描述
在这里插入图片描述

4、勾选“使用 npm 模块”选项：

详情–>使用 npm 模块
在这里插入图片描述

5、具体的组件引入和使用根据官方文档示例即可。

参考文章：
微信小程序如何引入npm包？
如何在微信小程序用npm引入组件库

怪哈哈
关注
专栏目录
微信小程序 npm 安装 weui
daveswong的博客
06-09 377
npm 支持从小程序基础库版本 2.2.1 或以上、及开发者工具 1.02.1808300 或以上开始，小程序支持使用 npm 安装第三方包。检查开发工具版本；小程序版本检查项目设置，设置调试基础库版本，顺便勾选 “使用 npm 模块”；没有 node.js 的需要先安装 node.js；Download | Node.js在小程序根目录（类似 C:\Users\User\WeChatProjec...
关于微信小程序安装npm的过程，从下载到小程序内部安装完成
m0_72190449的博客
11-13 4721
1.先从官网下载nodejs 网站为Node.js (nodejs.org)，选择左边第一个2 然后一直next，选默认就行 选择自己喜欢的路径我的是D:\nodejs-v18.12.1 3 下载完成后，先在安装文件夹中新建两个文件夹 node_cache node_global 4 配置一下环境变量，如果不配置好就会导致微信微信小程序里面找不到路径的情况，打开控制面板->系统与安全->系统->高级系统设置->环境变量 一共要配置三个地方 一个是
微信小程序使用npm包的方法步骤
最新发布
胡西风的博客
09-27 501
此例使用 js-base64 包实现，在你需要使用此包的 js 文件中引入 npm 包。1：点击微信开发者工具右上角详情——> 本地设置，选中使用 npm 模块。如果你的小程序项目没有安装过 npm 包的话，你需要先初始化 npm。当显示如下表示 npm 构建成功，构建完成就可以使用 npm 包了。2：点击微信开发者工具菜单栏的工具，选择构建 npm。2：使用 npm 包中的自定义组件。2：使用 npm 包中的自定义组件。1：js 中引入 npm 包。
微信小程序npm包安装教程
weixin_34319374的博客
04-03 769
bash cd 到小程序根目录 npm init 生产package.json npm i xxxx -S -production build IDE->tools->build npm check Details->use NPM module 严格按照如上步骤
uni-app使用npm命令安装组件
u010855711的博客
06-01 4535
uni-app框架开发微信小程序，使用npm方式安装组件前提程序安装及详细使用方法介绍。
微信小程序--安装npm包
weixin_43794332的博客
02-04 832
下载node.js 可修改地址，不一定要在c盘，自动安装即可 若后续出现不识别npm命令，需要重新配置node.js的环境变量 安装npm包 在小程序 package.json 所在的目录中执行命令安装 npm 包： npm init npm install apifm-wxapi 构建 npm 勾选“使用 npm 模块”选项 点击菜单栏中的"设置",选择其中的"项目设置",勾选“使用npm模块” 使用npm包官方文档 使用npm包官方教程 ...
微信小程序nvm安装->npm安装->vant组件安装
01-11
微信小程序nvm安装->npm安装->vant组件安装 在微信小程序开发中，安装nvm、npm和vant组件是非常重要的步骤。下面将详细介绍这三个安装步骤的知识点。 nvm安装 nvm（Node Version Manager）的安装是微信小程序开发...
微信小程序使用npm支持踩坑
10-17
微信小程序从基础库版本2.2.1及以上和开发者工具1.02.1808300及以上开始，正式支持通过npm安装第三方库，这极大地扩展了小程序的功能性。然而，实际开发过程中，开发者可能会遇到各种“坑”。 在本文中，作者在开发...
微信小程序使用Vant Weapp组件库的方法步骤
10-16
微信小程序是腾讯公司推出的一种不需要下载安装...需要注意的是，随着微信小程序和 Vant Weapp 组件库的不断更新迭代，具体的命令和操作方法可能有所变化，请开发者实时关注官方文档，以获取最新的技术信息和使用指南。
微信小程序使用npm包、全局数据共享和分包_npm 能不能让 所有包放到一起
2301_82243558的博客
04-20 402
Vant Weapp 是有赞前端团队开源的一套小程序 UI 组件库，助力开发者快速搭建小程序应用。它所使用的是 MIT 开源许可协议，对商业使用比较友好。官方文档地址API Promise化，指的是通过额外的配置，将官方提供的、基于回调函数的异步 API，升级改造为基于 Promise 的异步 API，从而提高代码的可读性、维护性，避免回调地狱的问题。全局数据共享（又叫做：状态管理）是为了解决组件之间数据共享的问题。开发中常用的全局数据共享方案有：Vuex、Redux、MobX 等。
微信小程序 使用npm包
qq_36158551的博客
02-04 1787
van-button type="primary">按钮</van-button>
微信小程序如何进行npm导入组件
m0_72168336的博客
03-31 3540
微信小程序通过npm引入组件
微信小程序项目 如何npm安装 weui
weixin_39965426的博客
05-28 993
<p>1.第一步，先要下载node.js，</p> 2.先建立一个空的文件夹，然后用小程序开发工具打开之后，在下图指示中进入cmd，输入npm init,进行初始化，然后一路可以默认（enter） 3.在一路默认后，就可以在目录中看到了package.json文件 4.开始安装Weui组件库 npm install --save weui-miniprogram --production 安装完...
微信小程序安装npm
u011635667的博客
02-04 891
微信开发工具（必须支持npm功能）; node.js安装； npm基础知识； 以下操作是node.js已经安装过了。1、先建好小程序模版。 然后使用dos命令打开这个当前的文件夹。比如下图： 注意：dos命令打开的是小程序文件夹所放的路径。 2、初始化指令 如果是该文件夹第一次使用： 请先使用指令npm init(初始化指令); 3、安装 npm install 4、按照微信小...
npm 安装_微信小程序使用npm安装第三方库
weixin_39710251的博客
12-05 655
嗨，大家好，我是小马丁这是我的第48篇文章，感谢你的阅读.从小程序基础库版本 2.2.1 或以上、及开发者工具 1.02.1808300 或以上开始，小程序支持使用 npm 安装第三方包。此文档要求开发者们对 npm 有一定的了解，因此不会再去介绍 npm 的基本功能。如若之前未接触过 npm，请翻阅官方 npm 文档进行学习。01npm initnpm init //初始化 pa...
微信小程序安装外部npm
小隐的博客
01-10 515
以vant组件库为例，打开cmd。切换到小程序项目根目录 1.初始化项目npm init 2.引入vant组件库npm i @vant/weapp -S --production 3.打开微信小程序，勾选，使用npm模块 4.工具 —》构建npm 看到这个时构建就完成了 ...
微信小程序怎么构建npm？
qq_37805832的博客
09-04 6216
因为系统引入外部UI库时需要的。不然外部的UI库运行不起来.
Mac的微信小程序组件npm的包起步怎么弄
06-01
3. 在终端中输入以下命令来安装微信小程序组件 npm 包： ``` npm install <package-name> --save ``` 其中，`<package-name>` 是你要安装的微信小程序组件 npm 包的名称。例如，如果你要安装微信小程序的 `...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值