小程序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(初级篇)的更多相关文章

  1. 使用wepy开发微信小程序商城第二篇:路由配置和页面结构

    使用wepy开发微信小程序商城 第二篇:路由配置和页面结构 前言: 最近公司在做一个微信小程序的项目,用的是类似于vue的wepy框架.我也借此机会学习和实践一下. 小程序官方文档:https://d ...

  2. 使用wepy开发微信小程序商城第一篇:项目初始化

    使用wepy开发微信小程序商城 第一篇:项目初始化 前言: wepy小程序项目初始化的操作,官方文档看了好几遍,感觉写得不是很清楚. 这篇写得挺好的:小程序开发之wepy 1.初始化项目 (1)全局安 ...

  3. python爬取微信小程序(实战篇)

    python爬取微信小程序(实战篇) 本文链接:https://blog.csdn.net/HeyShHeyou/article/details/90452656 展开 一.背景介绍 近期有需求需要抓 ...

  4. JDownload: 一款可以从网络上下载文件的小程序第四篇(整体架构描述)

    一 前言 时间过得真快,距离本系列博客第一篇的发布已经过去9个月了,本文是该系列的第四篇博客,将对JDownload做一个整体的描述与介绍.恩,先让笔者把记忆拉回到2017年年初,那会笔者在看Unix ...

  5. 我的微信小程序第三篇(app.json)

    前言 端午节回家了,所以好多天没有更新,只想说还是待在家里舒服呀,妈妈各种做好吃的,小侄子侄女各种粘着我在室外玩,导致我三天下来不仅胖了一圈,还黑了一圈,上班第一天有同事就说我晒黑了,哭~~~,为了防 ...

  6. 微信小程序开发——进阶篇

    由于项目的原因,最近的工作一直围绕着微信小程序.现在也算告一段落,是时候整理一下这段时间的收获了.我维护的小程序有两个,分别是官方小程序和一个游戏为主的小程序.两个都是用了wepy进行开发,就是这个: ...

  7. 微信小程序开发入门篇

    本文档将带你一步步创建完成一个微信小程序,并可以在手机上体验该小程序的实际效果. 开发准备工作 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的& ...

  8. 小程序npm构建

    npm initnpm install --productionnpm i  第三方组件名称  -S --production //重要

  9. 微信小程序 npm 找不到npm包 没有找到可以构建的npm包 如何使用第三方npm组件

    微信官方的npm文档 太模糊了,而且感觉把最重要的东西写在了最后面,我这里费了老大功夫才知道这个坑. 初次使用,首先要初始化 npm 初始化——> 找到 pages 这个文件夹,然后进入这个文件 ...

随机推荐

  1. javax.servlet.ServletException: Could not resolve view with name 'order/list' in servlet with name 'dispatcherServlet'

    javax.servlet.ServletException: Could not resolve view with name 'order/list' in servlet with name ' ...

  2. javascript中的对象拷贝

    js中的数据类型 在介绍javascript中的对象的拷贝之前,我先介绍一个基础的东西,javascript中的数据类型. 我们做前端的应该都知到在es6 之前,javascript中的数据类型Boo ...

  3. 牛客国庆训练 H.千万别用树套树

    链接https://ac.nowcoder.com/acm/contest/1108/H 国庆队内训练的题,当时还完全没思路,就没补.现在会树状数组了,倒是能想一想,不过网上题解好多用线段树传数组的? ...

  4. 秒杀系统(一)----环境搭建及集成Mybatis、Redis

    1.1 环境搭建--pom文件 <?xml version="1.0" encoding="UTF-8"?> <project xmlns=& ...

  5. CentOS7环境下安装docker

    操作系统 : CentOS7.5.1804_x64 docker版本: docker-ce-18.06.3 准备环境 1.如之前安装过移除老旧版本 yum remove docker docker-c ...

  6. 5.java基础之static、类加载过程

    static修饰符 修饰属性:静态的属性不属于任何对象,全类及其对象共用,可以用类名直接调用 修饰方法:静态的方法可以直接用类名调用,和对象无关.静态方法只能访问静态成员和静态方法,非静态方法可以调用 ...

  7. zuul实现的限流

    限流一般可以根据客户端IP,请求的URL,用户登陆信息进行限制,每秒钟限制多次数,这从别一方面也提升了系统的性能,无用的并发没那么多了. 依赖包 <dependency> <grou ...

  8. 45-管理 Machine

    用 docker-machine 创建 machine 的过程很简洁,非常适合多主机环境.除此之外,Docker Machine 也提供了一些子命令方便对 machine 进行管理.其中最常用的就是无 ...

  9. django重点url,视图函数,模板语言

    django重点url,视图函数,模板语言url 1.django重点url无命名分组:re_path() 2.url第一个参:url未命别名分组就不需要views中参数一定,若命别名(?P<y ...

  10. TypeScript初体验

    第一次运行TypeScript 1.创建文件夹并初始化项目 mkdir ts-demo cd ts-demo npm init -y 2.安装typescript与ts-node # 局部安装 npm ...