微信官方的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. CentOs7.X下配置FTP

    https://blog.csdn.net/cc_want/article/details/85337241 CentOS7.x自带firewall防火墙,FTP使用需要开启20 21 22 3000 ...

  2. 中小型企业级 IPS 部署

    <构建基于Snort+Guardian+Iptables的IPS> 2020年的第三天,依旧如往常写文章,分享最近做的项目继<中小型企业级防火墙部署>之后的另一部分<构建 ...

  3. 【题解】CF986E Prince's Problem(树上差分+数论性质)

    [题解]CF986E Prince's Problem(树上差分+数论性质) 题目大意: 给定你一棵树,有点权\(val_i\le 10^7\).现在有\(m\)组询问给定参数\(x,y,w\)问你对 ...

  4. $CF888G\ Xor-MST$ 最小生成树

    正解:最小生成树 解题报告: 传送门$QwQ$ 发现$Kruskal$和$Prime$都不太可做,于是考虑$B$算法. 先大概港下$B$算法的流程趴$QwQ$.大概就,每次对每个联通块找到最近的联通块 ...

  5. Scala:用于Java的轻量级函数式编程

    Scala为Java开发提供了轻量级的代码选项,但是学习过程可能会很艰难.了解有关Scala的知识以及是否值得采用. 基于Java的语言通常涉及冗长的语法和特定于领域的语言,用于测试,解析和数值计算过 ...

  6. Django 多表、跨表、聚合、分组查询

    前期准备: 创建表 class Book(models.Model): title = models.CharField(max_length=32) price = models.DecimalFi ...

  7. asp.net core 实现支持多语言

    asp.net core 实现支持多语言 Intro 最近有一个外国友人通过邮件联系我,想用我的活动室预约,但是还没支持多语言,基本上都是写死的中文,所以最近想支持一下更多语言,于是有了多语言方面的一 ...

  8. Oracle基础之保留字和关键字

    Oracle基础之保留字和关键字 在Oracle之中,有分为保留字和关键字,所谓关键字就是Oracle中有实际意义的,而保留字(比如DESC.ORDER等等)是Oracle中不能随便使用的,比如不能随 ...

  9. SQL server 基本语句

    --查询数据库是否存在 if exists ( select * from sysdatabases where [name]='TestDB') print 'Yes, the DB exists' ...

  10. 【Java基础总结】多线程

    1. 实现多线程的两种方式 //第一种:继承Thread类,重写run()方法 class ThreadTest1 extends Thread{ public void run(){ String ...