当前位置:首页 > 开发工具 > 前端学习-常用开发工具

前端学习-常用开发工具

2022年09月16日 15:21:57开发工具6

常用开发工具:

Babel,Node,Gulp,subLimeText,Webpack,Yarm,npm,Git,VsCode,WebStorm。

Npm&Yarm

什么是Node

Node.js 是一个开源与跨平台的 JavaScript 运行环境。

  • 可以在 Node 中运行来进行 I/O操作、文件操作、数据库操作
  • Node 提供了 JavaScript 实现后端数据服务的能力

NPM包&管理工具

包管理器

Npm的主要作用就是用来管理可复用的代码包。比如 JavaScript,Java,python 等等。

Npm包和新概念

本质是一段用于复用的代码块。

Npm包官方建议至少包含:

  1. package.json 描述文件
  2. index.js 代码入口
  3. README.md 说明文档

Npm Script

  1. scripts字段是一个对象。它的每一个属性,对应一段脚本。
  2. npm脚本(shell命令)由用户提供。
  3. 不同项目的脚本命令,只要功能相同,就可以有同样的对外接口,项目的相关脚本,可以集中在一个地方。 

生产环境和开发环境依赖

  • 在生产环境中所依赖的包:npm install [包名] -save
  • 仅在开发和测试环节中需要依赖的包:npm install [包名] -save -dev

Npm的安装命令

  • 安装单个指定包:npm install [包名]@[版本号] 
  • 安装项目package.json所有依赖:npm install

版本号规范:

  • X主版本号:当你做了不兼容的 API 修改(可能不兼容之前的版本)
  • Y次版本号:当你做了向下兼容的功能性新增(新功能增加,但是兼容之前的版本) 
  • Z修订号:当你做了向下兼容的问题修正(没有新功能,修复了之前版本得bug)

^和~的区别:

  • ^x.y.z:表示x是保持不变的,y和z永远安装最新的版本
  • ~x.y.z:表示x和y保持不变的,z永远安装最新的版本

Yarn

由于Npm出现较早,即使不停迭代优化,已经逐渐被一些后起之秀超越。Yarn 逐渐成为了包管理的主流工具

Yarn 的优点:

  • 速度快
  • 安装版本统一
  • 输出去简介
  • 多注册来源管理
  • 更语义化

Yarn.lock文件:

  • 自动生成
  • 精确信息
  • 锁定版本 

Npm & Yarn 指令简介与对比

作用 npm yarn
安装 npm install/i yarn
卸载 npm uninstall/un yarn remove
全局安装 npm | xxx -global/-g yarn global and xxx
安装包 npm | xxx -save/-S yarn add xxx
开发模式安装包 npm | xxx --save-dev/-D yarn add xxx -dev/-D
更新 npm update yarn upgrade
全局更新 npm update -g yarn global upgrade
卸载 npm un xxx yarn remove xxx

本文章整理自上课ppt,仅供学习使用。 

作者:什巳
来源链接:https://blog.csdn.net/qq_48772498/article/details/123541823

版权声明:
1、JavaClub(https://www.javaclub.cn)以学习交流为目的,由作者投稿、网友推荐和小编整理收藏优秀的IT技术及相关内容,包括但不限于文字、图片、音频、视频、软件、程序等,其均来自互联网,本站不享有版权,版权归原作者所有。

2、本站提供的内容仅用于个人学习、研究或欣赏,以及其他非商业性或非盈利性用途,但同时应遵守著作权法及其他相关法律的规定,不得侵犯相关权利人及本网站的合法权利。
3、本网站内容原作者如不愿意在本网站刊登内容,请及时通知本站(javaclubcn@163.com),我们将第一时间核实后及时予以删除。


本文链接:https://www.javaclub.cn/tool/41901.html

标签: 开发工具
分享给朋友:

“前端学习-常用开发工具” 的相关文章

HTML开发工具的安装与使用(HbuilderX)

HTML开发工具的安装与使用(HbuilderX)

HTML开发工具的安装与使用(HbuilderX) 文章目录 HTML开发工具的安装与使用(HbuilderX) 一. 软件下载 二. 工具结构 三. 创...

微信小程序开发工具基本介绍入门级(备忘)

微信小程序开发工具基本介绍入门级(备忘)

1、注册微信小程序开发者账号 登录微信公众平台或者复制链接https://mp.weixin.qq.com/ 第一步点击立即注册 第二步、选择小程序(根据步骤操作即可) 2、下载微信开发者工具 下载地址微信开发者工具下载地址...

Python 开发环境搭建

Python 开发环境搭建

1. Python环境安装 https://www.python.org/ 下载Python windows 64位版 下载安装即可. 2. 开发工具 下载eclipse插件pydev,并放置于eclipse文件目录内 hel...

谷粒商城--从入门到入坟(持续更新)第四篇:开发工具、环境安装配置

谷粒商城--从入门到入坟(持续更新)第四篇:开发工具、环境安装配置

需要安装idea、vscode、jdk、maven、git 一,jdk与maven jdk8及以上,maven3.6左右 maven换为阿里云的镜像 在maven文件->config->setting.xml中 <...

Java基础---Java 开发工具IntelliJ IDEA 安装

Java基础---Java 开发工具IntelliJ IDEA 安装

1.1 开发工具概述IDEA是一个专门针对Java的集成开发工具(IDE),由Java语言编写。所以,需要有JRE运行环境并配置好环境变量。它可以极大地提升我们的开发效率。可以自动编译,检查错误。在公司中,使用的就是IDEA进行开发。 1.2 IDEA 软件安装此软件集成了32位...

CentOS7 系统Minimal 安装后必备的开发工具(推荐新手查看)

CentOS7 系统Minimal 安装后必备的开发工具(推荐新手查看)

yum groups info <Tab><Tab>    # 连续两次<Tab> 显示内容为(可以不看,自己执行命令查看): [root@localhost ~]# yum gr...

开发工具合集专题《开发工具,IAR工具安装步骤记录》

开发工具合集专题《开发工具,IAR工具安装步骤记录》

目录 软件安装 软件激活(IARkg_Unis) 软件版本:IAR EW for 8051 10.10.1 IAR EW for 8051 官方下载(建议下载与本教程相同的版本):点击进入 软件安装 ​​...

visual studio 2019 工具里添加开发中命令提示符

visual studio 2019 工具里添加开发中命令提示符

→_→→_→觉得有帮助,点个赞吧 最新新装了visual studio 2019,发现默认的没有开发者命令提示符 现将添加步骤描述如下: 从VS2019菜单选择“Tools”,然后选择“外部工具”。输入如下: 标题:Visual Studio 命令...

Java学习中的数据库和数据库开发工具

Java学习中的数据库和数据库开发工具

一、数据库 1、数据库,通常是一个戒一组文件,保存了一些符合特定规格的数据,数据库对应的英询单词是DataBase,简称DB;数据库软件称为数据库管理系统,英文简称DBMS,全称为DataBase Management System,例如:Oracle...

小米路由器安装MT工具箱(图文教程)

小米路由器安装MT工具箱(图文教程)

小米路由器安装MT工具箱(图文教程) 前几天某鱼50元入手了一台小米路由器R3。成色还不错,暂时用不上,想了想不如拿起来折腾吧。于是。。。。。 于是我默默安装了个MT工具箱,然后某鱼99元转手卖了出去,去掉8元邮费,赚了41元。看来我很有当奸商的天赋。...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。