小程序系列1-小程序构建npm

一、使用前先认识阅读npm与package.json详解

二、使用npm

1、新建小程序项目

image.png

2、npm初始化 - 生成package.json

小程序目录下输入：npm init 一路回车确认
或者直接npm init -yes跳过所有设置项目

image.png

3、安装npm包 - 安装vant-weapp

npm i vant-weapp -S --production

这个时候仅仅是把npm安装到项目里，还没有真正在小程序里生效.

image.png

也可以直接添加

  "dependencies": {
    "vant-weapp": "^0.5.29"
  }

然后使用nmp i 进行安装

安装成功

image.png

4、npm包构建 - 勾选使用npm模块 - 构建npm - 生成miniprogram_npm

构建之后项目根目录生成miniprogram_npm文件夹，这个才是小程序实际使用的npm目录

image.png
image.png
image.png

注意事项：每次安装一个新的npm包都得重新在小程序构建npm

5、使用 npm 包中的自定义组件

"usingComponents": {
    "van-button": "vant-weapp/button/index"
}

<van-button type="primary">van按钮</van-button>

image.png

查看npm配置
npm config ls

配置npm镜像源
npm config set registry=https://registry.npm.taobao.org/