npm 上传一个自己的应用(3) 在项目中导入及使用自己上传到NPM的工具

上文 npm 上传一个自己的应用(2) 创建一个JavaScript函数 并发布到NPM 我们创建了一个函数 并发上了npm
在这里插入图片描述
最后 我们这里 我们可以看到它的安装指令

这里 我们可以打开一个vue项目
在这里插入图片描述
终端输入 我们的安装指令
npm i 自己的包
如下代码

npm i grtest

在这里插入图片描述
我们在 node_modules目录
在这里插入图片描述
下面 找到 我们自己想依赖项目

打开这个index.js 这个方法看着是不是非常熟悉呢? 哈哈哈
在这里插入图片描述
因为 我们这里的导出是

export {summation
}

这是多个导出

export default summation

才是唯一导出

因为是多个导出 我们导入 要这样

import { summation } from "grtest";

简单说 import { 要引入的方法/组件名 } from “工具名”;
如果是 唯一导出 import 要引入的方法/组件名 from “工具名”;

然后 我们组件整体编写代码如下

<template><div><button @click="count">计算</button></div>
</template><script>
import { summation } from "grtest";
export default {data() {return {};},methods: {count() {let arg = summation(1,2);console.log(arg);}}
};
</script>

这里 我们导入了 我们写的 grtest 下的 summation
然后 通过函数 count 调用 summation 我们方法逻辑是 两个参数相加
然后我们写一个 arg 变量 接收返回值 然后控制台输出
点击后确认 没有任何问题
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

[C#]winform制作仪表盘好用的表盘控件和使用方法

【仪表盘一般创建流程】 在C#中制作仪表盘文案&#xff08;通常指仪表盘上的文本、数字或指标显示&#xff09;涉及到使用图形用户界面&#xff08;GUI&#xff09;组件&#xff0c;比如Windows Forms、WPF (Windows Presentation Foundation) 或 ASP.NET 等。以下是一个使用W…

Linux网络通信——TCP/OSI七层模型/TCP/IP(五层或四层模型)/HTTP报文传输原理

文章目录 消息的传输什么是OSI七层模型OSI七层模型的内容物理层&#xff08;Physical Layer&#xff09;&#xff1a;数据链路层&#xff08;Data Link Layer&#xff09;&#xff1a;网络层&#xff08;Network Layer&#xff09;&#xff1a;传输层&#xff08;Transport Lay…

vue3-内置组件-Teleport

Teleport <Teleport> 是一个内置组件&#xff0c;它可以将一个组件内部的一部分模板“传送”到该组件的 DOM 结构外层的位置去。 基本用法 有时我们可能会遇到这样的场景&#xff1a;一个组件模板的一部分在逻辑上从属于该组件&#xff0c;但从整个应用视图的角度来看…

实现注册登录时数据的加密传输(含前后端具体代码)

前言 http/https协议提交在被抓包时请求内容是明文的, 直接传输账号密码的风险非常大&#xff0c;故这里我们要对数据加密处理&#xff0c;并生成校验码&#xff0c;防止数据篡改 目录 ​编辑 前言 具体思路 代码实现 前端信息加密处理&#xff08;Vue&#xff09; 安装…

Java多线程:线程安全

&#x1f451;专栏内容&#xff1a;Java⛪个人主页&#xff1a;子夜的星的主页&#x1f495;座右铭&#xff1a;前路未远&#xff0c;步履不停 目录 一、线程状态1、New&#xff08;初始状态&#xff09;2、Terminated&#xff08;终止状态&#xff09;3、Runnable&#xff08;…

C++类型转化cast from pointer to smaller type ‘int‘ loses information

代码如下 #include <iostream>int main() {int a 10;std::cout << (int)&a << std::endl;return 0; }编译 这段代码是要将地址转化成整数类型&#xff0c;但是在编译时编译器告诉我们这是错的&#xff0c;因为在C中&#xff0c;将指针转换为int类型的…

Spring基础 - Spring核心之面向切面编程(AOP)

Spring基础 - Spring核心之面向切面编程(AOP) 引入 Spring 框架通过定义切面, 通过拦截切点实现了不同业务模块的解耦&#xff0c;这个就叫面向切面编程 - Aspect Oriented Programming (AOP)那么Spring框架又是如何实现AOP的呢&#xff1f; 这就引入代理技术&#xff0c;分静…

Sqlite3安装步骤

1、Sqlite3以下载文件&#xff0c;配置环境变量的方式进行安装。 2、下方链接为官方的下载地址。 sqlite下载地址 2.1、需要两个下载文件&#xff0c;解压后将他们放在一起&#xff0c;假设解压后的路径为E:\sqlite。 sqlite-dll-win-x64-3450100.zip sqlite-tools-win-x6…

C++自定义函数详解

个人主页&#xff1a;PingdiGuo_guo 收录专栏&#xff1a;C干货专栏 铁汁们新年好呀&#xff0c;今天我们来了解自定义函数。 文章目录 1.数学中的函数 2.什么是自定义函数 3.自定义函数如何使用&#xff1f; 4.值传递和引用传递&#xff08;形参和实参区分&#xff09; …

OLED调试简介

文章目录 一、介绍调试方法介绍OLED简介硬件电路OLED驱动函数 二、操作连接线路使用驱动函数显示内容 OLED.c的内容 一、介绍 调试方法介绍 OLED简介 硬件电路 OLED驱动函数 二、操作 连接线路 因为这两个引脚不做配置是浮空状态&#xff0c;在这里直接用电源给OLED供电 使…

嵌入式学习之Linux入门篇笔记——10,Linux连接档概念

配套视频学习链接&#xff1a;http://【【北京迅为】嵌入式学习之Linux入门篇】 https://www.bilibili.com/video/BV1M7411m7wT/?p4&share_sourcecopy_web&vd_sourcea0ef2c4953d33a9260910aaea45eaec8 目录 1.Linux 下的连接档种类 2.什么是 inode&#xff1f; 3.什…

Node.js JSON Schema Ajv依赖库逐步介绍验证类型和中文错误提示

在构建应用程序时&#xff0c;数据的有效性是至关重要的。为了确保传入的数据符合预期的格式和规范&#xff0c;我们可以使用 Ajv&#xff08;Another JSON Schema Validator&#xff09;进行验证。在这篇博文中&#xff0c;我们将从头开始学习 Ajv&#xff0c;逐步介绍验证类型…

Linux探秘之旅:透彻理解路径、命令与系统概念

目录 如何远程连接 远程登录简明指南 linux区别 1.严格区分大小写 2.linux的命令返回结果判断 3.如何查看网络信息 4.关于后缀名&#xff08;Linux不关心文件后缀&#xff09; 4.1 需要记忆的后缀 5.echo命令 6.linux一切皆文件 6.1比如磁盘的文件 6.2可执行文件 …

在面试中如何回复擅长vue还是react

当面试官问及这个问题的时候&#xff0c;我们需要思考面试官是否是在乎你是掌握vue还是react吗&#xff1f;&#xff1f;&#xff1f; 在大前端的一个环境下&#xff0c;当前又有AI人工智能的加持辅助&#xff0c;我们是不是要去思考企业在进行前端岗位人员需求的时候&#xf…

【原创】Qt库open62541 MinGW编译

一、前言 为了统一公司的驱动层开发&#xff0c;准备采用OpcUA的方式转发底层数据&#xff0c;而服务器有Windows Server&#xff0c;也有CentOS&#xff0c;因此想用Qt开发一个基于MinGW的OpcUA Server&#xff0c;这样就能跨平台部署。这里记录一下&#xff0c;希望对你也有用…

Android Studio无法安装Git问题解决(折中方案)

安装配置好studio&#xff0c;往往会使用git克隆github上面的项目&#xff0c;但是却发现git无法正确安装&#xff0c;本文将介绍如何解决git无法安装这一问题。 对于git安装&#xff0c;实际比较复杂&#xff0c;可以参考这一篇博客。 Git 详细安装教程&#xff08;详解 Gi…

Java多线程:`Thread`类

&#x1f451;专栏内容&#xff1a;Java⛪个人主页&#xff1a;子夜的星的主页&#x1f495;座右铭&#xff1a;前路未远&#xff0c;步履不停 目录 一、Thread的常见构造方法二、Thread 的常见属性三、Thread的常用方法1、start方法2、中断一个线程Ⅰ、通过共享标记Ⅱ、调用in…

Git版本与分支

目录 一、Git 二、配置SSH 1.什么是SSH Key 2.配置SSH Key 三、分支 1.为什么要使用分支 2.四个环境及特点 3.实践操作 1.创建分支 2.查看分支 3.切换分支 4.合并分支 5.删除分支 6.重命名分支 7.推送远程分支 8.拉取远程分支 9.克隆指定分支 四、版本 1.什…

[BUUTF]-PWN:wdb2018_guess解析

查看保护 查看ida 这道题并不复杂&#xff0c;只是要注意一点细节 完整exp&#xff1a; from pwn import* from LibcSearcher import* pprocess(./guess) premote(node5.buuoj.cn,28068) puts_got0x602020payloadba*0x128p64(puts_got) p.sendlineafter(bPlease type your gu…

国产三维剖面仪—MPAS-100相控参量阵浅地层剖面仪

最近声学所东海站邹博士发来了他们最新的浅地层剖面仪—MPAS-100相控参量阵浅地层剖面仪的资料&#xff0c;市场型号GeoInsight&#xff0c;委托Ocean Physics Technology公司销售&#xff0c;地大李师兄的公司负责技术支持。 MPAS-100相控参量阵浅地层剖面仪就是俗称的三维浅…