小程序 npm 支持

使用 npm 包

目前小程序已经支持使用 npm 安装第三方包,因为 node_modules 目录中的包不会参与小程序项目的编译、
上传和打包,因此在小程序
项目中要使用的 npm 包,必须走一遍构建 npm 的过程。在构建成功以后,默认 会在小程序目录根目录,
也就是 node_modules 同级目录下生成 miniprogram_npm 目录,
里面存放着构建完成以后的 npm 包,也就是小程序运行过程中真正使用的包

在这里插入图片描述
1、在项目根目录中 右键 选择【在内建终端中打开】
在这里插入图片描述
2. 从底部弹出终端的窗口中 输入 npm init -y
在这里插入图片描述
3.在命令行输入需要安装的包后 在微信开发者工具中 点击 工具 点击 构建npm 这样npm包才可以使用
在这里插入图片描述
注意
小程序运行在微信内部,因为运行环境的特殊性,这就导致并不是所有的包都能够在小程序使用
我们在小程序中提到的包指专为小程序定制的 npm 包,简称小程序npm包,在使用包之前需要先
确定该包是否支持小程序
开发者如果需要发布小程序包,需要打开官方规范:官方规范

自定义构建npm

在实际开发中,随着项目的功能越来越多、项目越来越复杂、文件目录也变的很繁琐,为了方便进行项目的开发,
开发人员通常会对目录结构进行调整优化,例如:将小程序源码放到 miniprogram 目录下这时候需要开发者在 project.config.json 中 指定 node_modules 的位置 和 
目标 miniprogram_npm 的位置
配置如下:1. 配置 project.config.json 的 miniprogramRoot 指定小程序源码的目录2. 配置 project.config.json 的 setting.packNpmManually 为true,开启自定义node_modules 和 miniprogram_npm 位置的构建 npm 方式3. 配置 project.config.json 的 setting.packNpmRelationList 项,指定 packageJsonPath 和 miniprogramNpmDistDor的位置4. 重新打开项目 才能生效成功 
{"appid": "。。。","compileType": "miniprogram","libVersion": "3.4.8","miniprogramRoot": "miniprogram/","packOptions": {"ignore": [],"include": []},"setting": {"packNpmManually": true,"packNpmRelationList": [{"packageJsonPath": "./package.json","miniprogramNpmDistDir": "./miniprogram"}],"useCompilerPlugins": ["sass"],"coverView": true,"es6": true,"postcss": true,"minified": true,"enhance": true,"showShadowRootInWxmlPanel": true,"babelSetting": {"ignore": [],"disablePlugins": [],"outputPath": ""}},"condition": {},"editorSetting": {"tabIndent": "insertSpaces","tabSize": 2},"srcMiniprogramRoot": "miniprogram/"
}

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/40333.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【keil5问题】keil5中突然debug调试不能全速运行的问题

1、问题现象: 原本的项目工程是正常debug单步调试,然后突然出现是点击左上角的run全速运行,也全速运行不了,出现如下图的情况,点一次一步走的现象 2、问题解决: 2-1、问题分析: 点击reset、…

JavaScript中的this指向

1. 全局环境下的this 在全局环境中(在浏览器中是window对象,在Node.js中是global对象),this指向全局对象。 console.log(this window); // 在浏览器中为true console.log(this.document ! undefined); // true,因为…

opencv编译报错OpenCV does not recognize MSVC_VERSION “1940“

具体如下: CMake Warning at cmake/OpenCVDetectCXXCompiler.cmake:182 (message):OpenCV does not recognize MSVC_VERSION "1940". Cannot set OpenCV_RUNTIME Call Stack (most recent call first):CMakeLists.txt:174 (include) 打开源码\opencv\sources\cmak…

如何加密U盘?U盘加密软件推荐

U盘是我们最常用的移动存储设备,可以帮助我们随身携带大量数据。为了避免U盘数据泄露,我们需要加密保护U盘。那么,U盘该如何加密呢?下面小编就为大家推荐两款专业的U盘加密软件。 U盘超级加密3000 U盘超级加密3000是一款优秀的U盘…

大模型概述-定义/分类/训练/应用

大模型概述 随着时代的发展, 大模型各个领域的应用正在不断扩大. 本文尽力梳理各种材料, 将从概念定义, 类型分类, 训练以及应用等方面对大模型进行一个简要的概述. 如果你想了解大模型但是却缺乏基础的知识或者觉得无从下手, 那么阅读该文章可能对你有所帮助. 如果想了解更多…

Django任意URL跳转漏洞(CVE-2018-14574)

目录 Django介绍 URL跳转漏洞介绍 Django任意URL跳转漏洞介绍 环境搭建 防御方法 前段时间在面试时,问到了URL跳转漏洞,我没有回答好,下午把URL跳转漏洞学习了,发现也不难,看来还需要学习的东西很多呀&#xff0c…

cadence symbol修改之一

cdaence virtuoso 复制cell,或者拷贝symbol之后,再次调用的时候,symbol还是跟随原来的cell名字 解决办法 打开对应的symbol 修改partName为 cellName

把前端打包放到Eladmin框架中运行

再resuorces目录创建static文件夹,然后把前端文件放进来 然后修改 ConfigurerAdapter文件,如下图所示 这样就可以通过ip端口/index.html 这样访问啦!

垂直领域大模型的机遇与挑战:从构建到应用

在人工智能技术的浪潮中,大模型以其强大的数据处理和学习能力,成为推动科技进步的重要力量。然而,这种跨领域应用的过程并非一帆风顺,既面临挑战也蕴含机遇。本文从复旦大学的研究工作出发,详细分析大模型的机遇与挑战。 背景 GPT4技术报告指出,GPT4仍处于通用人工智…

土壤分析仪:分析土壤中的各种养分

土壤作为地球生命的摇篮,承载着农作物的生长与繁衍。土壤中的养分是农作物生长的关键。 一、土壤分析仪的工作原理 土壤分析仪是一种采用先进传感技术的仪器设备,能够精确测量土壤中的PH值、电导率、有机质含量、养分含量以及微生物数量等参数。它利用多…

# Kafka_深入探秘者(9):kafka 集群管理

Kafka_深入探秘者(9):kafka 集群管理 一、kafka 集群概述 1、kafka 集群概述: 集群是一种计算机系统,它通过一组松散集成的计算机软件和/或硬件连接起来高度紧密地协作完成计算工作。在某种意义上,他们可…

ffmpeg下载/配置环境/测试

一、下载 1、访问FFmpeg官方网站下载页面:FFmpeg Download Page; 2、选择适合Windows的版本(将鼠标移动到windows端)。通常,你会找到“Windows builds from gyan.dev”或者“BtbN GitHub Releases”等选项&#xff0…

研0学习Python基础4

1.数组是一种存储大量同性质数据的连续内存空间,只要使用相同的变量名称,便可以连续访问 每一组数据。由于数组元素的便利性,使得大多数程序中都可以看到数组的身影。数组是一 个带有多个数据且模式相同的元素集合。比如,数值所…

实验2 字符及字符串输入输出与分支程序设计实验

字符及字符串输入输出 从键盘输入两个一位十进制数,计算这两个数之和,并将结果在屏幕上显示出来。 分支程序设计 从键盘输入一字符,判断该字符是小写字母、大写字母、数字或者其他字符。若输入为小写字母,显示“You Input a Lo…

悼念之前的coplit

最近学MySQL七月三号还能正常卡bug使用紫色的coplit 然后今天就不行了 可惜了,蓝色的就是GPT3,紫色是4(可能比不上4但至少比蓝色的聪明点) 原来一开始问题框上面有三个模式选择,去年下半年的时候这个三个模式就被隐藏掉了&#x…

成都欣丰洪泰文化传媒有限公司开网店可靠吗?

在数字化浪潮席卷全球的今天,电商行业无疑是这场浪潮中的佼佼者。而在这波汹涌的电商大潮中,成都欣丰洪泰文化传媒有限公司凭借其专业的电商服务能力和前瞻的市场洞察力,成为了业界的一匹黑马。今天,就让我们一起揭开这家专注于电…

python绘制领域矩形

问题描述: 使用python书写代码实现以下功能:给定四个点的坐标,调用一个函数,可以使原来的四个点分别向四周上下左右移动15距离,分别记录下移动后的坐标,然后画出内侧矩形和外侧矩形 代码: im…

提升学生岗位管理效率,构建智慧校园学工管理新模式

智慧校园学工管理系统中的“学生岗位”功能,是连接学生与实践机会的桥梁,它集岗位发布、申请、管理、评价于一体,全方位支持学生在校期间的实践锻炼与能力提升。该功能让校园内外的各类组织能轻松在线发布多样化的实践岗位,比如助…

SAP HCM ABAP DEBUG小技巧

导读 INTRODUCTION 调试小技巧:今天分享下我在处理HCM业务中,通过一些DEBUG技巧,减少DEBUG参数输入的问题,经过会遇到调试代码,有时候DEBUG太快,错过自己想看的代码,有时候不想执行某段代码&…

Python基础教程——10个可视化案例实操,一图胜千言!

让数据集改变你的思维 数据可视化是数据科学家传达洞见和讲述数据故事的关键工具。作为 Python 开发者,我们拥有丰富的可视化库和工具,能够创建各种引人入胜的图表。本文将探索一些鲜为人知但实用的可视化类型,如桑基图(Sankey Diagrams)、脊…