小程序开发——使用npm插件(一)

本文介绍了在Windows环境下从零开始安装npm以及在小程序项目中使用npm的过程。首先,通过下载并安装Node.js(LTS版本)来获取npm。接着,在命令行中验证npm是否安装成功。然后,进入小程序项目目录,依次执行`npm install`,`npm init`和`npm i vant-weapp -S --production`命令。最后,在微信开发者工具中启用对npm模块的支持并进行构建。

环境:win x64 未使用过npm

cmd测试npm命令 结果:不是内部或外部命令,也不是可运行的程序

1、安装npm

node中自带npm,所以我们来安装node环境

下载地址:https://nodejs.org/en/

自己选择下载LTS或者Current版本,我选择了LTS;

区别:https://www.jianshu.com/p/014a14713dce  (我实在是懒得仔细看)

下载下来是msi的,打开安装

一路安装直到finish就可以了

测试是否安装成功 cmd中 node -v 及 npm -v

2、在小程序下构建npm

参考:https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html

 

cmd跳转到开发小程序的目录下

顺序执行  npm install ; npm init  ;npm i vant-weapp -S --production

npm init (一定要执行  一路回车下去就可以 ,也可以自己设置)

执行完成后目录下会多一个node_module,node_module里面会有vant-weapp

 

在开发者工具中构建npm

在本地设置中勾选 使用npm模块

构建完成后的开发工具目录中会有npm目录

 

### 微信小程序开发使用 npm 的相关信息 #### npm 支持概述 微信小程序支持通过 npm 来管理项目中的依赖库,这使得开发者能够更方便地引入第三方库并进行版本控制。不过需要注意的是,在微信小程序环境中使用 npm 存在定的局限性[^1]。 #### 二、配置 npm 构建环境 为了能够在微信小程序项目里利用 npm 功能,首先需要确保本地已经安装了 Node.js 和 cnpm 或者淘宝镜像下的 npm 工具。接着可以通过命令行工具执行 `npm init` 初始化个新的 package.json 文件来记录项目的依赖关系;之后再运行类似于 `npm i @vant/weapp -S --production` 这样的指令下载所需的模块到 node_modules 目录下[^2]。 #### 三、编译与打包流程 完成上述准备工作后,还需要借助 Wechat DevTools 提供的小程序 npm 插件来进行必要的转换操作——即将 commonjs 规范的代码转化为适合小程序运行的形式。具体来说就是打开 IDE 中的“工具”菜单项找到对应选项开启自动编译功能即可。 #### 四、注意事项 - 并不是所有的 npm 包都适用于微信小程序平台; - 需要特别留意所选包是否经过适配处理以适应小程序特有的文件结构和技术栈特点; - 对于些底层 API 调用可能还需额外做兼容性调整工作。 ```bash # 安装指定版本的 Vant WeApp 组件库作为生产依赖 $ npm i @vant/weapp@latest -S --production ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值