微信小程序使用npm

最新推荐文章于 2024-07-12 10:47:27 发布
最新推荐文章于 2024-07-12 10:47:27 发布
阅读量405 收藏
点赞数
分类专栏： 小程序 文章标签： 小程序 npm
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_15931971/article/details/107460198
版权

1、打开你的小程序项目；点击右键选择在终端打开

           

打开后如图

输入cd..切换到D：\WXWork\npmtest目录

2、再输入npm init 回车

然后一直按回车直到出现如下图时再输入y再回车

3、输入你要下载的npm包（我这里是Vant）如图：

按回车；出现下图表示下载成功：

4、回到你的微信小程序项目中；你可以看到多了一个node_modules目录；

还没有完，再点击微信小程序的工具中构建npm；出现了下图表示可以使用了，后面的开发过程可以安装官网的API进行开发；

中国友佳
关注
专栏目录
微信小程序使用npm包、全局数据共享和分包_npm 能不能让 所有包放到一起
2301_82243558的博客
04-20 393
Vant Weapp 是有赞前端团队开源的一套小程序 UI 组件库，助力开发者快速搭建小程序应用。它所使用的是 MIT 开源许可协议，对商业使用比较友好。官方文档地址API Promise化，指的是通过额外的配置，将官方提供的、基于回调函数的异步 API，升级改造为基于 Promise 的异步 API，从而提高代码的可读性、维护性，避免回调地狱的问题。全局数据共享（又叫做：状态管理）是为了解决组件之间数据共享的问题。开发中常用的全局数据共享方案有：Vuex、Redux、MobX 等。
微信小程序引入npm
cc_xxo的博客
02-16 8676
首先下载node并配置，若是第一次安装建议重启 在开发工具的目录中右击 > 在终端窗口打开 输入 npm init -y 之后输入npm i @vant/weapp -S --production 可参考 vant weapp 官网 点击工具栏上的工具 > 构建npm 即可 ...
小程序使用npm
半梅芒果干的博客
08-17 650
执行该命令之后直接全部回车进行，成功后会在你的小程序端文件目录里生成一个package.json文件。打开微信开发者工具，点击 工具 -> 构建 npm，构建完成后，即可引入成功。tips: 如果构建提示没有npm的话，重新执行下 npm init 即可。4.使用非常简单，在需要的页面引用后使用即可。......
微信小程序添加npm模块
qq_57985179的博客
08-30 4740
目录 1、阅读官方文档npm支持部分 2、搜索下载所需要的npm模块，此处我选择用Vant Weapp 3、若要决定使用npm模块，最好新建小程序之初就引入，避免后续出现冲突。现在简单新建一个小程序 5、若直接点击构建npm模块 6、此处应在桌面开启命令行工具 按步骤执行 --> cmd --> npm init ---> npm install ----> npm install vant-weapp --save --production、 打开cmd的方法一....
微信小程序使用 npm
weixin_44429307的博客
04-13 704
微信小程序使用 npm 终端运行npm init 安装你想要的包npm i packageName 修改文件内容project.config.json 构建npm即可
微信小程序使用npm包的方法步骤
10-16
主要介绍了微信小程序使用npm包的方法步骤，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
微信小程序使用npm支持踩坑
01-03
最近写了个CNode 社区的微信小程序版本，把在微信小程序中使用npm包，踩的坑记录一下，希望能给遇到类似问题的小伙伴，提供一些思路和方向。 npm 支持 从小程序基础库版本 2.2.1 或以上、及开发者工具 1.02.1808300...
微信小程序如何进行npm导入组件
m0_72168336的博客
03-31 3429
微信小程序通过npm引入组件
微信小程序如何引入npm包
泊一的博客
12-09 1140
微信小程序如何引入npm包
微信小程序使用npm包
huaweichenai的博客
08-12 2751
一：npm初始化 如果你的小程序项目没有安装过npm包的话，你需要先初始化npm npminit 二：安装npm包 这里以vant-weapp(小程序UI组件库)为例： npmivant-weapp-S--production 三：npm包构建 1：点击微信开发者工具右上角详情——>本地设置，选中使用npm模块 2：点击微信开发者工具菜单栏的工具，选择构建n...
如何向小程序中导入npm
qq_43517139的博客
05-24 525
话不多说，我们直接开始吧~ 首先找到你要导入npm的那个项目文件夹，以我这个“实战”项目为例 进入文件夹之后，可以直接右击加“shift"键，打开命令行 敲重点啦！ 首先初始化一下 敲入代码 npm init 会在最下行有“package name:”直接就在后面输入你要安装的包名就好，我是前面实验安装 weui-miniprogram 输入包名之后，会弹出后面一系列balabala 你就一直回车，直到出现“Is this OK?（yes)" 再回车 输入 npm install --save-dev
在小程序中使用npm包
Rob_gao的博客
11-02 5034
如果小程序中是第一次使用npm，是没有package.json文件的，所以直接npm install --production就会告诉你，没有什么可安装的，就不会创建node_modules文件夹，所以一定要先npm init，初始化npm； 如果小程序中已经有package.json文件，直接npm install --production就可以了； 如果想引入哪一个npm包时，直接npm ...
微信小程序项目 npm安装构建
weixin_44283955的博客
07-22 660
微信小程序安装依赖
微信小程序---npm 支持
最新发布
m0_56769104的博客
07-12 1522
在实际的开发中，随着项目的功能越来越多、项目越来越复杂，文件目录也变的很繁琐，为了方便进行项目的开发，开发人员通常会对目录结构进行调整优化，例如：将小程序源码放到 miniprogram 目录下。但是在调整目录以后，我们按照上一小节Vant Weapp的构建流程进行构建，发现没有构建成功，并且弹出构建失败的弹框[错误提示翻译意思是] ：没有找到可以构建的 npm 包请确认需要参与构建的 npm 都在目录内配置的和进行构建默认构建npm自定义构建npm1、默认构建 npm。
微信小程序 -- npm 支持
每天都要努力学习哦~~
02-21 2251
在实际的开发中，随着项目的功能越来越多、项目越来越复杂，文件目录也变的很繁琐，为了方便进行项目的开发，开发人员通常会对目录结构进行调整优化，例如：将小程序源码放到 miniprogram 目录下。但是在调整目录以后，我们按照上一小节Vant Weapp的构建流程进行构建，发现没有构建成功，并且弹出构建失败的弹框[错误提示翻译意思是] ：没有找到可以构建的 npm 包请确认需要参与构建的 npm 都在目录内配置的和进行构建默认构建npm自定义构建npm默认构建 npm。
微信如何构建npm包
damolaozu的博客
01-18 203
微信 npm构建失败 第一步：npm init 在根目录下一路回车到家 第二步：npm i @vant/weapp -S --production 这里需要跟上安装的npm包的名字 第三步： 修改 project.config.json 按照 具体步骤参照微信开发文档里面的构建npm步骤 第四步： 在微信工具里面直接构建npm包 如果微信x小程序工具出现下图错误 重启微信小程序即可 ...
QQ小程序云开发
Gravitas的博客
02-02 860
QQ小程序的开发有时候需要使用云开发能力，下面是我自己总结的云开发初始化的相关教程。 注：在最初构建项目时要选择使用云服务。 1.下载Nodejs 下载地址，全部选择默认安装即可。（下图中版本号可能不对） 2. 在小程序根目录打开终端，执行npm init，全部按回车 cmd切换到指定目录方法：相关博客 3. 在终端输入npm install --save @cloudbase/extension-ci，等待执行完毕。 4.点击QQ小程序开发者顶部栏 - 工具 - 构建npm 5.在QQ小程序需要云开发的
微信小程序怎样使用npm
04-24
微信小程序使用 npm 包的话，需要满足以下条件： 1. 微信开发者工具的基础库版本需大于等于 2.2.3 ； 2. 在小程序项目根目录下创建一个名为 package.json 文件，用来管理 npm 包及其依赖； 3. 在开发者工具中勾选...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值