微信官方的npm文档 太模糊了,而且感觉把最重要的东西写在了最后面,我这里费了老大功夫才知道这个坑。

初次使用,首先要初始化  npm

初始化——>   找到 pages 这个文件夹,然后进入这个文件夹的上级目录  也就是项目的根目录  在这个根目录

        使用  npm init -f   初始化命令    -f  表示全部输入默认值,懒得一个个回车。

初始化之后——>  npm install -production docxtemplater 构建npm项目的配置文件,作用好像是按需加载 ——>这个命令生成了一个xxx.json文件

接着————>  在微信开发者工具中,设置 ——> 项目设置——> 勾选使用npm模块

再之后主题来了!这个后面的步骤是,一次新npm一个第三方npm组件,会用到的

假如我要使用recycle-view长列表npm组件

  首先 打开 微信官方文档 搜索   recycle-view

    从中我们找到了它的npm命令  

    npm install --save miniprogram-recycle-view

  找到 pages 这个文件夹,然后进入这个文件夹的上级目录  也就是项目的目录。

    在这个目录右键——>在终端中打开,然后使用这个命令 npm install --save miniprogram-recycle-view 才行

    

    npm完了之后!!!

  在微信开发者工具中, 工具——>构建npm——>当当当当!在pages同级目录中,你可以找到一个长得像  miniprogram_npm  的文件, 他的下面
  就有了官方文档中说的 那个东西  miniprogram-recycle-view/recycle-view  和  miniprogram-recycle-view/recycle-item

  使用。

    假如我在index页面使用,那

    index.json中 类似这样写:

      "usingComponents": {
        "recycle-view": "../../miniprogram_npm/miniprogram-recycle-view/recycle-view",
        "recycle-item": "../../miniprogram_npm/miniprogram-recycle-view/recycle-item"
      }
 
    index.wxml中
      <recycle-view  balabala的属性查看官方文档...... >
        <recycle-item>   盘它   </recycle-item>
      </recycle-view>
总结:——>勾选使用npm模块
    ——>根目录
    ——>npm install
     ——>工具  构建npm
    ——>usingComponents:{ /path }
    ——>wxml中使用
注意:这个是在wxml中使用第三方npm组件的大致步骤。
  在js中使用的步骤,嗯,我还没用到,用到了再写
 
  

微信小程序 npm 找不到npm包 没有找到可以构建的npm包 如何使用第三方npm组件的更多相关文章

  1. 迅速上手:使用taro构建微信小程序基础教程

    前言 由于微信小程序在开发上不能安装npm依赖,和开发流程上也饱受诟病:Taro 是由京东·凹凸实验室(aotu.io)倾力打造的 多端开发解决方案,它的api基于react,在本篇文章中主要介绍了使 ...

  2. 转载:微信小程序源码提取反编译

    转载来源:www.51xuediannao.com/xiaochengxu/019c08cc.html 一.前言 微信小程序源码提取反编译,听起来很屌,其实还是简单的,基本是傻瓜式操作.要想拿到微信小 ...

  3. webstrom开发微信小程序说明

    在操作之前,需要对webstrom做一些设置,如下 如果未安装node.js的朋友,请到如下地址 https://nodejs.org/en/ 安装(相信大家都是会的),如果安装完了之后,就使用如下的 ...

  4. 个微信小程序云开发云函数

    1. project.config.json写上云函数所在目录"cloudfunctionRoot": "cloudfunctions/",如图 2. app. ...

  5. 记录使用微信小程序的NFC和蓝牙功能读取15693芯片的开发历程

    开发目标: (1) 对于Android手机,直接通过微信小程序调用手机的NFC功能,对15693协议的芯片进行读写操作: (2)对于苹果手机(及没有NFC模块的手机),通过微信小程序的蓝牙功能连接到蓝 ...

  6. 「速成应用」实在可靠的 微信小程序第三方代理加盟平台公司

    小程序,是基于微信平台的一个划时代产品,也就是嵌入到微信里的一个功能丰富.操作简洁的轻应用,不需要下载安装即可使用.不同的小程序,能实现不同的功能.例如,买电影票.餐厅排号.餐馆点菜.查询公交.查询股 ...

  7. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  8. 微信小程序 新手入门教程

    因为工作需要,最近学习了一下微信小程序,在此分享一下大概的流程. 强烈建议大家先去看微信小程序简易教程:点我进入 起步: 安装微信web开发软件者工具,需要破解的同学可以网上找破解教程,很简单的,这里 ...

  9. 如何反编译微信小程序👻

    如何反编译微信小程序 准备工具: 夜神模拟器(或者你可以自己准备一个安卓模拟器,有root权限.) RE文件管理器(下载地址:https://soft.ucbug.com/uploads/shouji ...

  10. 耗时一个月上架了一款微信小程序,赚了2022年的第一笔副收入

    今天不谈技术,只谈经历. 前戏 相信有很多的程序员都有一个产品梦,希望有一款属于自己产品.毕竟工作中遇到的有些"脑残"的产品经理不是一个两个,最后不得不因为"技术服务于业 ...

随机推荐

  1. Kafka学习笔记(四)—— API使用

    Kafka学习笔记(四)-- API使用 1.Producer API 1.1 消息发送流程 Kafka的Producer发送消息采用的是异步发送的方式.在消息发送的过程中,涉及到了两个线程--mai ...

  2. 在 Win7、Win10 家庭版中启用组策略(gpedit.msc)

    Windows 家庭版并没有组策略,对于计算机维护.优化和设置非常不方便.使用以下批处理可以在不安装专业版.旗舰版的情况下启用组策略. 一.新建一个批处理脚本 1 @echo off 2 3 push ...

  3. jib-maven-plugin构建镜像

    序言 在本次期末设计当中,应为需要做部署脚本,我们采用的是dockerfile+docker-compose的部署方式,这种方式对vue项目是没有问题的,因为vue下载依赖与打包是分离开来的,即使修改 ...

  4. antDeaign-form-getFieldDecorator 使用注意事项

    2020-01-06 antDeaign-form-getFieldDecorator 使用注意事项 一.使用getFieldDecorator之前,必须先使用 Form.create({ })(Fo ...

  5. SpringBoot 2.X整合Mybatis

    1.创建工程环境 勾选Web.Mybatis.MySQL,如下 依赖如下 <dependency> <groupId>org.springframework.boot</ ...

  6. Docker入门之快速安装和卸载使用Centos7

    一.检查内核版本 注意:Docker要求操作系统必须是64位,如果使用的Centos内核版本为3.10以上 执行命令:uname  -r 二.安装依赖软件包 执行命令:yum install -y y ...

  7. 【转】基于ArcGIS for javascript api 轨迹回放

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  8. Golang 正则匹配 -- regexp

    匹配特殊字符 //re :=regexp.MustCompile("[~!@#$%^&*(){}|<>\\\\/+\\-[]:\"?'::''"&qu ...

  9. 关于django中的get_or_create方法的坑

    最近在项目中发现了这样的一个坑,那就是我们的需求是不能添加一个相同的对象到数据库中,就通过某些字段的值组合成唯一值到数据库中去查找数据,如果没有找到对象,那就创建一条新的数据库记录,而刚好django ...

  10. 转:详解G1垃圾收集器

    G1垃圾收集器入门 说明 concurrent: 并发, 多个线程协同做同一件事情(有状态) parallel: 并行, 多个线程各做各的事情(互相间无共享状态) 参考: What’s the dif ...