小程序npm(初级篇)
小程序npm
NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:
允许用户从NPM服务器下载别人编写的第三方包到本地使用。
允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。
使用npm
小程序从基础库版本2.2.1开始支持使用 npm 安装第三方包,因此也支持开发和使用第三方自定义组件包。
1.在小程序中执行命令安装npm包
npm install -- production
production是npm包名称
node_modules必须在小程序根目录下,也可以存在于小程序根目录下的各个子目录中。但是不允许 node_modules 在小程序根目录外
2.在开发者工具的菜单栏点击工具工具 --> 构建npm
构建npm生成miniprogram_npm目录,而且只有miniprogram_npm会被算入小程序包的占用空间

3. [endif]构建完成后即可使用 npm 包。
发布、制作npm
为了方便开发者能够快速搭建好一个可用于开发、调试、测试的自定义组件包项目,官方提供了一个项目模板,下载使用模板的方式有三种:
直接从 github 上下载 zip 文件并解压。
直接将 github 上的仓库 clone 下来。
使用官方提供的命令行工具初始化项目,下面会进行介绍。
官方命令行工具npm install -g @wechat-miniprogram/miniprogram-cli
初始化项目miniprogram init --custom-component生成模板工程
1.npm install安装依赖
2.npm run dev会在根目录下生成miniprogram_dev目录。
1.src中的源代码会被构建饼生成到miniprogram_dev/componentm目录下。
2.Eslint是默认开启的,如果不想自己调整规则的话可以在tools/config.js中将其关闭
3.miniprogram_dev是一个小程序项目目录,可以在这里查看自定义组件的效果
4.miniprogram_dis是自己创建的文件夹,用来存放做好的自定义控件,在构建npm的时候会将这个目录下的文件放到miniprogram_npm中(注:如果不放到改目录下会报错,该问题有待研究)

小程序npm(初级篇)的更多相关文章
- 使用wepy开发微信小程序商城第二篇:路由配置和页面结构
使用wepy开发微信小程序商城 第二篇:路由配置和页面结构 前言: 最近公司在做一个微信小程序的项目,用的是类似于vue的wepy框架.我也借此机会学习和实践一下. 小程序官方文档:https://d ...
- 使用wepy开发微信小程序商城第一篇:项目初始化
使用wepy开发微信小程序商城 第一篇:项目初始化 前言: wepy小程序项目初始化的操作,官方文档看了好几遍,感觉写得不是很清楚. 这篇写得挺好的:小程序开发之wepy 1.初始化项目 (1)全局安 ...
- python爬取微信小程序(实战篇)
python爬取微信小程序(实战篇) 本文链接:https://blog.csdn.net/HeyShHeyou/article/details/90452656 展开 一.背景介绍 近期有需求需要抓 ...
- JDownload: 一款可以从网络上下载文件的小程序第四篇(整体架构描述)
一 前言 时间过得真快,距离本系列博客第一篇的发布已经过去9个月了,本文是该系列的第四篇博客,将对JDownload做一个整体的描述与介绍.恩,先让笔者把记忆拉回到2017年年初,那会笔者在看Unix ...
- 我的微信小程序第三篇(app.json)
前言 端午节回家了,所以好多天没有更新,只想说还是待在家里舒服呀,妈妈各种做好吃的,小侄子侄女各种粘着我在室外玩,导致我三天下来不仅胖了一圈,还黑了一圈,上班第一天有同事就说我晒黑了,哭~~~,为了防 ...
- 微信小程序开发——进阶篇
由于项目的原因,最近的工作一直围绕着微信小程序.现在也算告一段落,是时候整理一下这段时间的收获了.我维护的小程序有两个,分别是官方小程序和一个游戏为主的小程序.两个都是用了wepy进行开发,就是这个: ...
- 微信小程序开发入门篇
本文档将带你一步步创建完成一个微信小程序,并可以在手机上体验该小程序的实际效果. 开发准备工作 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的& ...
- 小程序npm构建
npm initnpm install --productionnpm i 第三方组件名称 -S --production //重要
- 微信小程序 npm 找不到npm包 没有找到可以构建的npm包 如何使用第三方npm组件
微信官方的npm文档 太模糊了,而且感觉把最重要的东西写在了最后面,我这里费了老大功夫才知道这个坑. 初次使用,首先要初始化 npm 初始化——> 找到 pages 这个文件夹,然后进入这个文件 ...
随机推荐
- k8s采坑记 - 证书过期之kubeadm重新生成证书
重新生成证书 证书备份 cp -rp /etc/kubernetes /etc/kubernetes.bak 移除过期证书 rm -f /etc/kubernetes/pki/apiserver* r ...
- OD 快捷方式及窗口说明
OD 快捷方式 其他窗口 L : log 保存日志信息 E :程序的所有模块的信息(加载基址,大小,OEP,路径) M :程序的内存映射视图 T :线程信息 W :窗口信息 H :句柄表 C :CPU ...
- Promise代码详解(show you the code)
认识异步函数 同步函数: const sum1 =(a,b)=>{ return a+b } console.log('AAA'); console.log(sum(5,6)); conosle ...
- 一起学SpringMVC之RequestMapping详解
本文以一个简单的小例子,简述SpringMVC开发中RequestMapping的相关应用,仅供学习分享使用,如有不足之处,还请指正. 什么是RequestMapping? RequestMappin ...
- feign使用hystrix熔断的配置
熔断器hystrix 在分布式系统中,每个服务都可能会调用很多其他服务,被调用的那些服务就是依赖服务,有的时候某些依赖服务出现故障也是很正常的. Hystrix 可以让我们在分布式系统中对服务间的调用 ...
- SpringBoot 项目运行在 tomcat7 上
SpringBoot 项目如何打成 war 包 SpringBoot项目的默认打包方式是将工程打包成为一个 jar 包.部分情况下,我们需要将项目打包成一个 war 包,以方便我们将工程部署在 tom ...
- 分布式缓存 Redis 集群搭建
Redis 集群简介 Redis Cluster 即 Redis 集群,是 Redis 官方在 3.0 版本推出的一套分布式存储方案.完全去中心化,由多个节点组成,所有节点彼此互联.Redis 客户端 ...
- Android8.1 源码修改之插入SIM卡默认启用Volte功能
前言 公用电话产品,插入SIM卡后要求自动打开Volte功能,即插即用,用完拔卡就走 实现 第一步 开关对应的代码 通过打印日志和全局查找,源码位置 vendor/mediatek/proprieta ...
- MySQL数据库:合并结果集
合并结果集 union----合并结果集 对合并后的结果集中的重复数据也会自动去重 select sName from students union select tName from Teacher ...
- 07-Django视图进阶
1.调试模式 Django项目下的settings.py 默认是DEBUG=True,开发的时候一般要开启调试模式,当项目完成发布必须要改成False,否则会暴露网站的配置信息,修改以下两行: # D ...