使用npm script运行webpack

npm(Node Package Manager)是 Node.js 的包管理工具,用于安装、发布和管理 Node.js 包。

在安装node的时候,就默认安装了npm。

Npm Script 则是 Npm 内置的一个功能,允许在 package.json 文件里面使用 scripts 字段定义任务,比如下面这个:

"scripts": {"test": "echo \"Error: no test specified\" && exit 1"
}

scripts字段是一个对象,每一个属性对应一段脚本,以上定义了任务 test。 Npm Script 底层实现原理是通过调用 Shell 去运行脚本命令,例如执行 npm run test 命令等同于执行命令 echo \"Error: no test specified\" && exit 1。

一旦在 package.json 中定义了脚本,你就可以使用 npm run <script-name> 命令来运行它。

可以向 npm 脚本传递参数,这些参数可以通过 `--` 分隔符传递给脚本,比如 npm run test -- --verbose,这将向test脚本传递 --verbose参数。

npm 还定义了一些预定义的脚本名称,如 `npm start`、`npm test` 等。你可以直接使用这些预定义脚本名称,而不需要在 `scripts` 字段中定义它们。当然,也可以定义一个名为start的任务,这样执行npm start就不是执行预定义脚本,而是执行在package.json中定义的start脚本。

Npm Script 还有一个重要的功能是能运行安装到项目目录里的 node_modules 里的可执行模块,比如之前安装了webpack,是无法直接在项目根目录下通过命令 webpack 去执行 Webpack 构建的,直接执行webpack命令会报错 command not found: webpack。

而是要通过命令 ./node_modules/.bin/webpack 去执行。

Npm Script 能方便的解决这个问题,只需要在 scripts 字段里定义一个任务

{"scripts": {"build": "webpack"}
}

Npm Script 会先去项目目录下的 node_modules 中寻找有没有可执行的 webpack 文件,如果有就使用本地的,如果没有就使用全局的。 所以现在执行 Webpack 构建只需要通过执行 npm run build 去实现。

在上一篇博客的代码工程里,这次主要的新增  改动如下

执行 npm run build,就会使用webpack打包,但是打包会报错,因为src目录以及src目录没有js文件,所以这里新建个空的

打包之后,会在dist目录下生成内容,git不要提交这里的文件

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

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

相关文章

C#之partial关键字

在C#中&#xff0c;partial关键字用于声明一个类、结构体、接口或方法的分部定义。这意味着可以将一个类或其他类型的定义分成多个部分&#xff0c;这些部分可以在同一个命名空间或程序集中的多个源文件中进行定义。当编译器编译这些部分时&#xff0c;会将它们合并成一个单独的…

机器学习面试篇

如何理解机器学习数据集的概念 数据集是机器学习的基础&#xff0c;它包括了用于训练和测试模型所需的数据。数据集通常以矩阵的形式存在&#xff0c;其中每一行代表一个样本&#xff08;或实例&#xff09;&#xff0c;每一列代表一个特征&#xff08;或属性&#xff09;。…

宝塔Linux面板5.9版本升级新版失败解决方法

下载地址&#xff1a;宝塔Linux面板5.9升级教程 宝塔5.9版本升级最新版宝塔失败&#xff0c;可以参考这份详细教程&#xff08;不断更新中&#xff09; 安装要求&#xff1a; Python版本&#xff1a; 2.6/2.7&#xff08;安装宝塔时会自动安装&#xff09; 内存&#xff1a;1…

k8s 使用Docker和Containerd对比分析

目录 k8s 使用Docker和Containerd对比分析 互动1&#xff1a;docker build构建的镜像和containerd镜像通用吗&#xff1f; 互动2&#xff1a;k8s1.24之前版本和1.24及1.24之后版本区别&#xff1f; k8s 使用Docker和Containerd对比分析 如果你使用Docker作为K8S容器运行时的…

Spring框架核心:揭秘Java厨房的智能烹饪艺术

前情回顾&#xff1a;Spring框架深度解析&#xff1a;打造你的Java应用梦工厂 六. 实现控制反转 6.1 描述如何在Spring中实现IoC 在Spring Town的厨房里&#xff0c;实现控制反转就像是将食材的采购和准备过程外包给了一个智能系统。这个系统知道每种食材的特性&#xff0c;也…

RabbitMQ(四种使用模式)

文章目录 1.Fanout&#xff08;广播模式&#xff09;1.基本介绍2.需求分析3.具体实现1.编写配置类 RabbitMQConfig.java2.编写生产者&#xff0c;发送消息到交换机 MQSender.java3.编写消费者&#xff0c;接受消息 MQReceiver.java4.控制层调用方法&#xff0c;发送信息到交换机…

Python中进程类Process的方法与属性的使用示例

一、示例代码&#xff1a; from multiprocessing import Process import time import osdef child_1(interval):print(子进程&#xff08;%s&#xff09;开始执行&#xff0c;父进程为&#xff08;%s&#xff09; % (os.getpid(), os.getppid()))t_start time.time()time.sle…

2025考研 | 北京师范大学计算机考研考情分析

北京师范大学&#xff08;Beijing Normal University&#xff09;简称“北师大”&#xff0c;由中华人民共和国教育部直属&#xff0c;中央直管副部级建制&#xff0c;位列“211工程”、“985工程”&#xff0c;入选国家“双一流”、“珠峰计划”、“2011计划”、“111计划”、…

BFS Ekoparty 2022 -- Linux Kernel Exploitation Challenge

前言 昨天一个师傅给了我一道 linux kernel pwn 题目&#xff0c;然后我看了感觉非常有意思&#xff0c;题目也不算难&#xff08;在看了作者的提示下&#xff09;&#xff0c;所以就花时间做了做&#xff0c;在这里简单记录一下。这个题是 BFS Lab 2022 年的一道招聘题&#…

泰迪智能科技携手新乡学院开展“泰迪智能双创工作室”共建交流会

为深化校企合作&#xff0c;实现应用型人才培养目标。5月8日&#xff0c;广东泰迪智能科技股份有限公司河南分公司市场总监张京瑞到访新乡学院数学与统计学院参观交流&#xff0c;数学与统计学院院长赵国喜、副院长皮磊、张秦&#xff0c;教研室主任许寿方、姚广出席本次交流会…

如何防止WordPress网站内容被抓取

最近在检查网站服务器的访问日志的时候&#xff0c;发现了大量来自同一个IP地址的的请求&#xff0c;用站长工具分析确认了我的网站内容确实是被他人的网站抓取了&#xff0c;我第一时间联系了对方网站的服务器提供商投诉了该网站&#xff0c;要求对方停止侵权行为&#xff0c;…

Git 如何管理标签命令(tag)

1.查看本地仓库tag --1.查看本地仓库tag UserDESKTOP-2NRT2ST MINGW64 /e/GITROOT/STARiBOSS/STARiBOSS-5GCA (gw_frontend_master) $ git tag 1stBossUpgrade V10.0.1_20220224_test V10.0.1_20220301_test tag-gwfrontend-V1.0.12-230625 tag-gw_frontend-23.08.29 tag-gw_f…

基于51单片机的冰箱控制系统设计( proteus仿真+程序+设计报告+原理图+讲解视频)

基于51单片机冰箱控制系统设计( proteus仿真程序设计报告原理图讲解视频&#xff09; 基于51单片机冰箱控制系统设计 1. 主要功能&#xff1a;2. 讲解视频&#xff1a;3. 仿真4. 程序代码5. 设计报告6. 原理图7. 设计资料内容清单&&下载链接资料下载链接&#xff1a; …

PCIe总线-PCIe简介

一、前言 PCIe总线是由PCI/PCI-X发展而来&#xff0c;但是两者之间有很大的不同。PCI/PCI-X采用的是并行总线&#xff0c;最大支持的频率为PCI-X2.0 的133MHz&#xff0c;传输速率最大仅为4262MB/s。同时使用并行总线&#xff0c;在PCB上也会造成布线资源紧张&#xff0c;线与…

SpringCloud 集成 RocketMQ 及配置解析

文章目录 前言一、SpringCloud 集成 RocketMQ1. pom 依赖2. yml 配置3. 操作实体4. 生产消息4.1. 自动发送消息4.2. 手动发送消息 5. 消费消息 二、配置解析1. spring.cloud.stream.function.definition 前言 定义 Spring Cloud Stream 是一个用来为微服务应用构建消息驱动能力…

idea 使用 git

可以看见项目地址&#xff0c; git clone 地址 就可以拉新项目了 命令 git remote -v

宁夏银川市起名专家的老师颜廷利:死神(死亡)并不可怕,可怕的是...

在中国优秀传统文化之中&#xff0c;汉语‘巳’字与‘四’同音&#xff0c;在阿拉伯数字里面&#xff0c;通常用‘4’来表示&#xff1b; 湖南长沙、四川成都、重庆、宁夏银川最靠谱最厉害的起名大师的老师颜廷利教授指出&#xff0c;作为汉语‘九’字&#xff0c;倘若是换一个…

八、e2studio VS STM32CubeIDE之内存使用情况窗口

目录 一、概述/目的 二、STM32CubeIDE Build Analyzer 三、e2studio Memory Usage 八、e2studio VS STM32CubeIDE之内存使用情况窗口 一、概述/目的 1、嵌入开发最大特点之一就是资源受限&#xff0c;关注芯片资源使用详情是优秀工程师的技能之一 2、Keil和IAR都不支持内存…

使用Docker+Jar方式部署微服务工程(前后端分离)看着一篇就够了

本篇教程的使用到的技术有springboot、springcloud、Nacos、Docker、Nginx部署前后端分离访问的微服务。 部署一下Nacos 首先我们需要在服务器中&#xff08;或者本地部署启动一下Nacos&#xff09;&#xff0c;这里我采用服务器的方式进行部署&#xff0c;这里有一点不一样的…

【XR806开发板试用】SPI驱动数码管显示

准备工作 安装repo 创建repo安装目录。 mkdir ~/bin下载repo wget https://storage.googleapis.com/git-repo-downloads/repo -P ~/bin/改变执行权限 chmod ax ~/bin/repo设置环境变量&#xff0c;在~/.bashrc文件的最后输入 export PATH~/bin:$PATH和export REPO_URLhttps://…