初识webpack项目

news2024/11/17 4:29:58

新建一个空的工程

-> % mkdir webpack-project

为了方便追踪执行每一个命令,最终产生了哪些变更,将这个空工程初始化成git项目

-> % cd webpack-project/

-> % git init
Initialized empty Git repository in /Users/lixiang/frontworkspace/webpack-project/.git/

在当前目录下,执行nvm current,查看当前使用的node版本

-> % nvm current
none

显示没有,执行nvm list,,查看本地电脑上可以使用的node版本

-> % nvm list
       v16.13.0
        v19.2.0
default -> 12.14.0 (-> N/A)
iojs -> N/A (default)
unstable -> N/A (default)
node -> stable (-> v19.2.0) (default)
stable -> 19.2 (-> v19.2.0) (default)
lts/* -> lts/iron (-> N/A)
lts/argon -> v4.9.1 (-> N/A)
lts/boron -> v6.17.1 (-> N/A)
lts/carbon -> v8.17.0 (-> N/A)
lts/dubnium -> v10.24.1 (-> N/A)
lts/erbium -> v12.22.12 (-> N/A)
lts/fermium -> v14.21.3 (-> N/A)
lts/gallium -> v16.20.2 (-> N/A)
lts/hydrogen -> v18.20.2 (-> N/A)
lts/iron -> v20.12.2 (-> N/A)

执行nvm use 19.2.0

-> % nvm use 19.2.0
Now using node v19.2.0 (npm v8.19.3)

执行 npm init -y,初始化一个空的npm项目

-> % npm init -y
Wrote to /Users/lixiang/frontworkspace/webpack-project/package.json:

{
  "name": "webpack-project",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

从git的变更看一下 npm init -y执行后,有哪些变更

git变更里,新增了一个package.json的文件,初始化了一个空的npm项目,将这个改动提交commit

执行npm install webpack webpack-cli --save-dev,安装webpack和webpack-cli

-> % npm install webpack webpack-cli --save-dev

added 119 packages, and audited 120 packages in 13s

16 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

git的变更里,package.json中可以看到新增了两个依赖项目,安装了webpack和webpack-cli

将package-lock.json和package.json这两份文件提交到git仓库,忽略node_modules文件

安装后的webpack,实际上是放到了node_module下,可以执行以下命令来验证webpack的版本

-> % ./node_modules/.bin/webpack -v

  System:
    OS: macOS 14.4.1
    CPU: (8) x64 Intel(R) Core(TM) i5-1038NG7 CPU @ 2.00GHz
    Memory: 182.02 MB / 16.00 GB
  Binaries:
    Node: 19.2.0 - ~/.nvm/versions/node/v19.2.0/bin/node
    Yarn: 1.22.22 - /usr/local/bin/yarn
    npm: 8.19.3 - ~/.nvm/versions/node/v19.2.0/bin/npm
  Browsers:
    Chrome: 124.0.6367.119
    Safari: 17.4.1
  Packages:
    webpack: ^5.91.0 => 5.91.0
    webpack-cli: ^5.1.4 => 5.1.4

这样,一个空的webpack工程就新建好了

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

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

相关文章

STM32微秒级别延时--F407--TIM1

基本配置: TIM1挂载在APB2总线上,150MHz经过15分频,得到10MHz计数频率,由于disable了自动重装载,所以只需要看下一次计数值是多少即可。 void TIM1_Delay_us(uint16_t us) //使用阻塞方式进行延时,ARR值不…

Colibri for Mac v2.2.0激活版:专业级无损音乐播放器

Colibri for Mac是一款专为Mac用户设计的高分辨率无损音乐播放器。它基于BASS技术构建,为用户带来极致的音频体验。Colibri支持所有流行的无损和有损音频格式,如FLAC、MP3、AAC等,确保音乐播放的清晰度和完美度。其独特的清晰比特完美播放技术…

hadoop学习---基于Hive的教育平台数据仓库分析案例(一)

案例背景: 大数据技术的应用可以从海量的用户行为数据中进行挖掘分析,根据分析结果优化平台的服务质量,最终满足用户的需求。教育大数据分析平台项目就是将大数据技术应用于教育培训领域,为企业经营提供数据支撑。 案例数据产生流…

华为鸿蒙系统(Huawei HarmonyOS)

华为鸿蒙系统(华为技术有限公司开发的分布式操作系统) 华为鸿蒙系统(HUAWEI HarmonyOS),是华为公司在2019年8月9日于东莞举行的华为开发者大会(HDC.2019)上正式发布的分布式操作系统。 华为鸿蒙…

贪心-耍杂技的牛

问题描述 农民约翰的 N头奶牛(编号为 1…N)计划逃跑并加入马戏团,为此它们决定练习表演杂技。 奶牛们不是非常有创意,只提出了一个杂技表演: 叠罗汉,表演时,奶牛们站在彼此的身上,形…

深入学习和理解Django视图层:处理请求与响应

title: 深入学习和理解Django视图层:处理请求与响应 date: 2024/5/4 17:47:55 updated: 2024/5/4 17:47:55 categories: 后端开发 tags: Django请求处理响应生成模板渲染表单处理中间件异常处理 第一章:Django框架概述 1.1 什么是Django?…

音视频开发之旅——实现录音器、音频格式转换器和播放器(PCM文件转换为WAV文件、使用LAME编码MP3文件)(Android)

本文主要讲解的是实现录音器、音频转换器和播放器,在实现过程中需要把PCM文件转换为WAV文件,同时需要使用上一篇文章交叉编译出来的LAME库编码MP3文件。本文基于Android平台,示例代码如下所示: AndroidAudioDemo Android系列&am…

OpenAI下周将发布ChatGPT搜索引擎,挑战谷歌搜索!

目前,多方位消息证实,OpenAI将会在5月9日上午10点公布该消息,大约是北京时间周五的凌晨2点。 5月3日,前Mila研究员、麻省理工讲师Lior S爆料,根据OpenAI最新的SSL证书日志显示,已经创建了search.chatgpt.c…

数据库开发关键之与DQL查询语句有关的两个案例

案例 案例1 条件分页查询 查看项目经理提供给我们的需求文档 模糊匹配的含义是 只要包含"张"就可以 use dduo;-- 按照需求完成员工管理的条件分页查询 根据输入条件 查询第一页的数据 每页展示10条记录 -- 输入条件: -- 姓名: 张 -- 年龄&…

基于Java+SpringBoot+Vue前后端分离音乐播放器系统设计与实现(有视频讲解)

博主介绍:✌全网粉丝5W,全栈开发工程师,从事多年软件开发,在大厂呆过。持有软件中级、六级等证书。可提供微服务项目搭建与毕业项目实战,博主也曾写过优秀论文,查重率极低,在这方面有丰富的经验…

统一大型语言模型和知识图谱:路线图

【摘要】 大型语言模型(LLM),如ChatGPT和GPT4,由于其涌现能力和泛化性,正在自然语言处理和人工智能领域掀起新的浪潮。然而,LLM是黑箱模型,通常无法捕捉和获取事实知识。相反,知识图…

QQ音乐尽享海量高品质曲库,无广绿色版 PC端 v20.05.0

01 软件介绍 QQ音乐,作为一个在线音乐平台,它已经超越了传统音乐播放软件的界限,演变成为一个全面的音乐生态系统。该平台为用户提供了丰富的服务,包括无尽可能的音乐资源、定制化的个性推荐、卓越的高保真音乐体验和互动式的社交…

二叉树的迭代遍历 | LeetCode 144. 二叉树的前序遍历、LeetCode 94. 二叉树的中序遍历、LeetCode 145. 二叉树的后序遍历

二叉树的前序遍历(迭代法) 1、题目 题目链接:144. 二叉树的前序遍历 给你二叉树的根节点 root ,返回它节点值的 前序 遍历。 示例 1: 输入:root [1,null,2,3] 输出:[1,2,3]示例 2&#x…

分布式锁之-redis

什么是分布式锁? 即分布式系统中的锁。在单体应用中我们通过锁解决的是控制共享资源访问的问题,而分布式锁,就是解决了分布式系统中控制共享资源访问的问题。与单体应用不同的是,分布式系统中竞争共享资源的最小粒度从线程升级成了…

NumPy库与PyTorch库的异同点

目录 1.单位的创建和操作 1.创建 2.形状变换 2.数学和统计操作 1.矩阵乘法 2.广播 3.统计计算 3.GPU支持 4.在深度学习中的作用 5.应用范围 NumPy库为数组服务,PyTorch库为张量服务,这是最本质的区别。 1.单位的创建和操作 1.创建 NumPy:使…

SQL注入-基础知识

目录 前言 一,SQL注入是什么 二,SQL注入产生的条件 三,学习环境介绍 四、SQL注入原理 五,SQL中常用的函数 六,关于Mysql数据库 前言 在网络安全领域中,sql注入是一个无法被忽视的关键点&#xff0c…

matlab例题大全

1.第一章 1.1 注:plot函数为画图函数。例plot(x1,y1,:,x2,y2,*); 1.2 注:root为求根函数。p为方程变量前面系数矩阵。 1.3 注: 2*x3y-1*z 2; 8*x2*y3*z 4; 45*x3*y9*z 23 求:x,y,z的值 注&#xf…

eNSP-浮动静态路由配置

ip route-static 192.168.1.0 24 192.168.3.2 preference 60 #设置路由 目标网络地址 和 下一跳地址 preference值越大 优先级越低 一、搭建拓扑结构 二、主机配置 pc1 pc2 三、配置路由器 1.AR1路由器配置 <Huawei>sys #进入系统视图 [Huawei]int g0/0/0 #进入接…

uniapp 微信开发工具上访问正常,真机调试一直跨域报错

微信小程序真机调试时&#xff0c;出现跨域问题&#xff0c;需要同时在后端设置多种允许跨域的设置&#xff1a; // 指定允许其他域名访问 header(Access-Control-Allow-Origin:*); // 响应类型 header(Access-Control-Allow-Methods:GET,POST,OPTION); // 响应头设置 header(…

使用Python爬取淘宝商品并做数据分析

使用Python爬取淘宝商品并做数据分析&#xff0c;可以按照以下步骤进行操作&#xff1a; 确定需求&#xff1a;确定要爬取的淘宝商品的种类、数量、关键词等信息。 编写爬虫程序&#xff1a;使用Python编写爬虫程序&#xff0c;通过模拟浏览器请求&#xff0c;获取淘宝商品的页…