既然npm run dev执行了vite命令,那我为何不直接输入vite?

问题背景

我成功地把代码模板推给了团队:Ctrl ACV工程师的提效之路------plop自动生成代码

队友在用的时候,按照我文档里写的,在执行plop命令的时候报错了,提示没有这个命令。针对这个问题,我做了一些探索。

首先新开一个文件夹,在这里运行命令去查询plop安装的版本:

bash 复制代码
plop -v
4.0.0

既然这个命令没报错,说明plop这个是全局可用的,查找node的安装目录AppData\Roaming\npm,果然发现了这个命令。因为我的plop用npm install =g plop安装过,所以不会报错,但是别人没有全局安装。

问题的解决方案之一就是让队友全局安装。

但是我们项目也本地安装了plop,难道这个是不生效的吗?

我在我的本地项目中查询plop安装的版本:

bash 复制代码
plop -v
CLI version 4.0.0
Local version 4.0.1

发现有一个Local version 4.0.1,这个就是我们在执行npm install plop -D的时候安装的(package-lock.json中能看出来)。

无独有偶,我发现项目的启动命令npm run devvite也是有同样的问题:

vbnet 复制代码
dev: 'vite'

npm run dev实际上是执行了vite,为什么我们要这样写?运行项目的直接输入vite不是更省力吗?

如果我直接输入vite,也会有报错,提示命令不存在。

npm run dev确实执行了vite,但是这里的vite命令,并不是直接在全局环境下去找,而是在node_modulesbin目录下去寻找执行语句,bin目录又指向了node_modules/vite/bin

过程梳理

  1. 在发布npm包的时候,package.json中可以定义bin,指向一个执行文件,在执行npm install的时候,自动在node_modulesbin目录下新增可执行文件。

  2. 在执行npm run XXX的时候,首先是去node_modulesbin目录下寻找是否有该命令,如果有的话,根据该命令,定位到执行文件,然后往下执行;如果找不到,就去node的全局环境找命令;再找不到,就会报错。

最终处理方案

package.json中新增一个scripts,

json 复制代码
{
    "scripts": {
        "create": "plop",
    }
}

使用方法:

shell 复制代码
npm run create [XXX] [XXX]

这样就不用全局安装plop了。

自己发布npm包时如何配置命令?

需要在package.json中定义bin

相关推荐
小江的记录本16 分钟前
【注解】常见 Java 注解系统性知识体系总结(附《全方位对比表》+ 思维导图)
java·前端·spring boot·后端·spring·mybatis·web
web守墓人17 分钟前
【前端】记一次将ruoyi vue3 element-plus迁移到arco design vue的经历
前端·vue.js·arco design
伊步沁心19 分钟前
Webpack & Vite 深度解析
前端
libokaifa20 分钟前
OpenSpec + TDD:让 AI 写代码,用测试兜底
前端·ai编程
用户158159637437021 分钟前
搭 AI Agent 团队踩了 18 个坑,总结出这 5 个关键步骤
前端
Kellen21 分钟前
Fumadocs 基础概念:从内容源到页面渲染
前端
Lee川22 分钟前
前端进阶之路:从性能优化到响应式布局的实战指南(Tailwindcss)
前端·面试
努力干饭中23 分钟前
Git Rebase 最佳实践
前端·git
Ferries25 分钟前
《从前端到 Agent》系列|02:应用层-提示词工程 (Prompt Engineering)
前端·人工智能·深度学习
Awu122726 分钟前
⚡Pretext: 无 DOM 布局回流的快速文本测量库
前端