小程序中使用npm

  1. 运行命令 npm install --production
    -- node_modules必须在小程序根目录下,也可以存在于小程序根目录下的各个子目录中。但是不允许 node_modules 在小程序根目录外 (建议是在根目录执行)
    -- 安装--production 目的是减少安装一些业务无关的包,从而减少整个小程序的大小。
    -- 可以用cnpm
    -- 我这里是在根目录下运行


    image.png

根据官网步骤执行命令 出现一下问题
image.png

npm WARN saveError ENOENT: no such file or directory, open 'D:\2019WORK\carLife
package.json'npm WARN enoent ENOENT: no such file or directory, open 'D:\2019WORK\carLife\package.json'
npm WARN carLife No description
npm WARN carLife No repository field.
npm WARN carLife No README data
npm WARN carLife No license field.

解决方案: 在当前目录npm init 一下 就可以了

2.再次执行npm install --production


image.png

此时目录中仅多出两个文件


image.png

3.打开开发者工具
image.png
  1. 这里js-base64模块 为例

npm install js-base64 -S --priduction

image.png

这是目录中会出现 node_modules这个目录


image.png

点开以后会发现有我们已经下载的js-base64模块


image.png
  1. 这时候打开微信开发工具 点击上方菜单 “ 工具 => 构建 npm” 即可 生成miniprogram_npm文件夹


    image.png

    6.我们找个页面试一下 打印一下是否能够正常使用


    image.png
  2. 如果引用ui库组建的话,以vant-ui为例, 以上过程都相同,在组件引用的时候


    image.png

    image.png

    image.png

可以 同样好用

完成
贴出官网地址,在官网的最下方还介绍了关于npm包发不得流程以及约束

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。