博客

  • 【NPM】使用指南

    查看本机镜像地址

    npm config get registry

    如果是默认源或者淘宝镜像切换成私服地址

    • 默认镜像:https://registry.npmjs.org
    • 淘宝镜像:http://registry.npm.taobao.org
    • 私服地址:http://xxxx

    修改镜像地址

    npm config set registry http://xxxx

    (npm 私服下 有hosted(私有仓库,登录上传都是使用此仓库) proxy(代理仓库去下载第三方依赖) group(对外暴露的仓库地址,配置镜像地址) 登录都是登录hosted,镜像地址都是group的) package.json文件内配置镜像地址

    {
        "publishConfig": {
            "registry": "http://xxxx"
        }
    }

    到项目目录下登录镜像

    npm login

    输入账号密码(如果指定全局镜像为私服可以不加 –registry)或

    npm login  --registry=http://xxxx(指定要登录镜像地址)

    查看登录用户

    npm whoami

    推送镜像(注意:上传的包名 package.json 中name不能有大写空格和下划线)

    npm publish

    (如果指定全局镜像为私服可以不加 –registry)或

    npm publish  --registry=http://xxxx
    更新包
    • 需要将package.json的version版本号进行更新(1.0.0->1.0.1)
    • 忽略上传文件,可在gitignore文件中添加忽略文件
    • 使用下载依赖包,在新的项目中添加依赖名称和版本号 进行npm install 如下载失败请查看镜像地址是否正确
    • 异常情况
    Code 描述
    400 可能登录地址不对,可能私服已经存在此版本
    403 可能未登录,或者账户没有权限
    401 私服仓库可能权限不够npm Bearer Token Realm 可能未激活
  • 【JS】判断登录设备是移动端还是PC端

    基于 navigator.userAgent 的 User Agent 检测

    function isMobileDevice () {
      const ua = navigator.userAgent || navigator.vendor || window.opera;
      const mobileRegex = /android|iphone|ipad|ipod|blackberry|iemobile|opera mini|mobile|windows phone|phone|webos|kindle|tablet/i;
      return mobileRegex.test(ua.toLowerCase());
    }

    通过 navigator.userAgent 获取浏览器标识字符串‌。正则表达式匹配移动端关键词(如 android、iphone、mobile 等)‌。返回 true 表示移动端,false 表示 PC 端。

    ‌基于 navigator.userAgent 的插件方案‌

    插件:mobile-detect.js

    插件通过解析 navigator.userAgent 中的设备标识符(如 Android、iPhone、Windows 等)实现设备判断‌。 支持更细分的设备类型检测(如平板、手机、PC)‌。

    import MobileDetect from 'mobile-detect';
    
    const md = new MobileDetect(navigator.userAgent);
    
    if (md.mobile()) {
      console.log("移动端登录设备(手机/平板)");
    } else if (md.tablet()) {
      console.log("平板设备");
    } else {
      console.log("PC 端设备");
    }
  • 【Nginx】学习笔记

    常用命令

    • 检查配置文件正确性

      nginx -t
    • 重启服务

      sudo nginx -s reload
    • 停止服务

      sudo nginx -s quit|stop
    • 启动服务

      sudo nginx
    • 查看进程

      ps aux | grep nginx

    其它

    • 查找 nginx.conf 的位置

      find / -name nginx.conf
    • 指定启动配置文件

      sudo nginx -c /usr/local/nginx/conf/nginx.conf
    user root owner; # 运行时的用户名
    worker_processes 1; # 运行时的进程数
    error_log /var/log/nginx/error.log; # 错误日志存放位置
    pid /run/nginx.pid; # 设置 nginx 的 master 进程 ID 写入的位置
    events {
        worker_connections 1024; # 设置每个 woker 进程同时能为多少个连接提供服务
    }
    http {
        include mime.types; # 把 mime.types 这个文件的内容加载进来
        access_log /var/log/nginx/access.log  main; # 指令设置了访问的日志存储的位置
        index index.html index.htm; # 设置了当请求的地址里不包含特定的文件的时候,默认打开的文件
        server {
            server_name hezhiyi.com; # 创建基于主机名的虚拟主机
            root "/Users/GZZHIYI/Documents/web"; # 配置虚拟主机的根目录 
            location / { ... }; # 配置 nginx 怎么样响应请求的资源
        }
    }
  • 【微信小程序】学习笔记

    微信小程序的框架主要包括以下几个核心部分:

    1. WXML(WeiXin Markup Language)

    • 作用:用于描述小程序的结构,类似于HTML。
    • 特点:支持数据绑定、条件渲染、列表渲染等功能。

    2. WXSS(WeiXin Style Sheets)

    • 作用:用于描述小程序的样式,类似于CSS。
    • 特点:支持大部分CSS特性,并扩展了尺寸单位(如rpx)以适应不同屏幕。

    3. JavaScript

    • 作用:用于处理小程序的逻辑。
    • 特点:支持ES6语法,提供丰富的API,如网络请求、数据存储、设备信息等。

    4. WXS(WeiXin Script)

    • 作用:一种脚本语言,可以在WXML中直接使用。
    • 特点:类似于JavaScript,但运行在视图层,适合处理一些简单的逻辑。

    5. JSON

    • 作用:用于配置小程序的页面、窗口表现、网络超时时间等。
    • 特点:简洁易读,支持注释(但在实际使用中需去除注释)。

    6. 小程序框架API

    • 作用:提供丰富的API,帮助开发者实现各种功能。
    • 分类:
      • 网络API:如wx.request、wx.uploadFile等。
      • 媒体API:如wx.chooseImage、wx.playVoice等。
      • 数据缓存API:如wx.setStorage、wx.getStorage等。
      • 位置API:如wx.getLocation、wx.openLocation等。
      • 设备API:如wx.getSystemInfo、wx.getNetworkType等。
      • 界面API:如wx.showToast、wx.showModal等。

    7. 小程序生命周期

    • 作用:管理小程序的启动、运行、销毁等过程。
    • 主要生命周期函数:
      • onLaunch:小程序初始化时触发。
      • onShow:小程序启动或从后台进入前台时触发。
      • onHide:小程序从前台进入后台时触发。
      • onError:小程序发生脚本错误时触发。

    8. 页面生命周期

    • 作用:管理页面的加载、显示、隐藏、卸载等过程。
    • 主要生命周期函数:
      • onLoad:页面加载时触发。
      • onShow:页面显示时触发。
      • onReady:页面初次渲染完成时触发。
      • onHide:页面隐藏时触发。
      • onUnload:页面卸载时触发。

    9. 组件

    • 作用:提供丰富的UI组件,帮助开发者快速构建界面。
    • 常见组件:
      • 基础组件:如view、text、image、button等。
      • 表单组件:如input、picker、slider等。
      • 导航组件:如navigator。
      • 媒体组件:如video、audio等。
      • 地图组件:如map。
      • 画布组件:如canvas。

    10. 自定义组件

    • 作用:允许开发者封装可复用的UI组件。
    • 特点:支持组件间的通信、生命周期管理、样式隔离等。

    11. 事件系统

    • 作用:用于处理用户交互事件。
    • 常见事件:
      • 触摸事件:如bindtap、bindlongpress等。
      • 表单事件:如bindinput、bindchange等。
      • 滚动事件:如bindscroll等。

    12. 路由

    • 作用:管理页面之间的跳转。
    • 常见API:
      • wx.navigateTo:保留当前页面,跳转到新页面。
      • wx.redirectTo:关闭当前页面,跳转到新页面。
      • wx.navigateBack:返回上一个页面。
      • wx.switchTab:跳转到tabBar页面。

    13. 数据绑定

    • 作用:将数据与视图进行绑定,实现数据的动态更新。
    • 特点:支持单向数据流,数据变化会自动更新视图。

    14. 模块化

    • 作用:支持将代码拆分为多个模块,便于管理和复用。
    • 特点:支持CommonJS模块化规范,使用require引入模块。

    15. 云开发

    • 作用:提供云端一体化的开发能力,包括数据库、存储、云函数等。
    • 特点:无需搭建服务器,开发者可以直接使用云端资源。

    16. 插件

    • 作用:允许开发者使用第三方插件,扩展小程序的功能。
    • 特点:插件可以独立开发、发布,供其他小程序使用。

    17. 分包加载

    • 作用:将小程序代码拆分为多个包,按需加载,减少首次启动时间。
    • 特点:支持主包和多个分包,分包可以独立加载。

    18. 性能优化

    • 作用:提升小程序的运行效率和用户体验。
    • 常见优化手段:
      • 减少setData调用:避免频繁更新视图。
      • 使用自定义组件:提高代码复用性和维护性。
      • 图片优化:压缩图片,使用合适的图片格式。
      • 分包加载:减少首次启动时的代码量。

    19. 安全

    • 作用:保障小程序的安全运行。
    • 常见安全措施:
      • 数据加密:对敏感数据进行加密存储。
      • 权限控制:限制API的调用权限。
      • 代码混淆:防止代码被反编译。

    20. 调试工具

    • 作用:帮助开发者调试小程序。
    • 特点:提供实时预览、代码调试、性能分析等功能。
  • 【Webpack】学习笔记

    构建作用

    构建工具就是将源代码转换成可执行的 JavaScript、CSS、HTML 代码,包括以下内容:

    • 代码转换:将 TypeScript 编译成 JavaScript、将 SCSS 编译成 CSS 等;
    • 文件优化:压缩 JavaScript、CSS、HTML 代码,压缩合并图片等;
    • 代码分割:提取多个页面的公共代码,提取首屏不需要执行部分的代码,让其异步加载;
    • 模块合并:在采用模块化的项目里会有很多个模块和文件,需要通过构建功能将模块分类合并成一个文件;
    • 自动刷新:监听本地源代码的变化,自动重新构建、刷新浏览器;
    • 代码校验:在代码被提交到仓库前需要校验代码是否符合规范,以及单元测试是否通过;
    • 自动发布:更新代码后,自动构建出线上发布代码并传输给发布系统。

    基本概念

    • Entry:入口,Webpack 执行构建的第一步将从 Entry 开始,可抽象成输入。

    • Module:模块,在 Webpack 里一切皆模块,一个模块对应着一个文件。Webpack 会从配置的 Entry 开始递归找出所有依赖的模块。

    • Chunk:代码块,一个 Chunk 由多个模块组合而成,用于代码合并与分割。

    • Loader:模块转换器,用于把模块原内容按照需求转换成新内容。

    • Plugin:扩展插件,在 Webpack 构建流程中的特定时机会广播出对应的事件,插件可以监听这些事件的发生,在特定时机做对应的事情。

    • module,chunk 和 bundle 其实就是同一份逻辑代码在不同转换场景下的取了三个名字:我们直接写出来的是 module,webpack 处理时是 chunk,最后生成浏览器可以直接运行的 bundle。

    • filename 指列在 entry 中,打包后输出的文件的名称;

    • chunkFilename 指未列在 entry 中,却又需要被打包出来的文件的名称。

    • webpackChunkName 是为预加载的文件取别名,

    • webpackPrefetch 会在浏览器闲置下载文件,

    • webpackPreload 会在父 chunk 加载时并行下载文件。

    • hash 计算与整个项目的构建相关;

    • chunkhash 计算与同一 chunk 内容相关;

    • contenthash 计算与文件内容本身相关。(注:chunkhash, contenthash不能同时和HMR使用)

    • source-map 大而全,啥都有,就因为啥都有可能会让 webpack 构建时间变长,看情况使用;

    • cheap-module-eval-source-map 这个一般是开发环境(dev)推荐使用,在构建速度报错提醒上做了比较好的均衡;

    • cheap-module-source-map 一般来说,生产环境是不配 source-map 的,如果想捕捉线上的代码报错,我们可以用这个。

    流程概括

    Webpack 的运行流程是一个串行的过程,从启动到结束会依次执行以下流程:

    1. 初始化参数:从配置文件和 Shell 语句中读取与合并参数,得出最终的参数;
    2. 开始编译:用上一步得到的参数初始化 Compiler 对象,加载所有配置的插件,执行对象的 run 方法开始执行编译;
    3. 确定入口:根据配置中的 entry 找出所有的入口文件;
    4. 编译模块:从入口文件出发,调用所有配置的 Loader 对模块进行翻译,再找出该模块依赖的模块,再递归本步骤直到所有入口依赖的文件都经过了本步骤的处理;
    5. 完成模块编译:在经过第4步使用 Loader 翻译完所有模块后,得到了每个模块被翻译后的最终内容以及它们之间的依赖关系;
    6. 输出资源:根据入口和模块之间的依赖关系,组装成一个个包含多个模块的 Chunk,再把每个 Chunk 转换成一个单独的文件加入到输出列表,这步是可以修改输出内容的最后机会;
    7. 输出完成:在确定好输出内容后,根据配置确定输出的路径和文件名,把文件内容写入到文件系统。

    在以上过程中,Webpack 会在特定的时间点广播特定的事件,插件在监听到感兴趣的事件后会执行特定的逻辑,并且插件可以调用 Webpack 提供的 API 改变 Webpack 的运行结果。

    流程细节

    Webpack 的构建流程可以分为以下三大阶段:

    1. 初始化:启动构建,读取与合并配置参数,加载 Plugin,实例化 Compiler。
    2. 编译:从 Entry 发出,针对每个 Module 串行调用对应的 Loader 去翻译文件内容,再找到该 Module 依赖的 Module,递归地进行编译处理。
    3. 输出:对编译后的 Module 组合成 Chunk,把 Chunk 转换成文件,输出到文件系统。

    关键的配置

    • context:上下文。
    • entry:入口文件,是所有依赖关系的入口,webpack 从这个入口开始静态解析,分析模块之间的依赖关系。
    • output:打包输出的配置。
    • devtools:SourceMap 选项,便于开发模式下调试。
    • watch:监听模式,增量更新,开发必备!
    • profile:优化。
    • cache:webpack构建的过程中会生成很多临时的文件,打开 cache 可以让这些临时的文件缓存起来,从而更快的构建。
    • module.loaders:如前文介绍,loaders 用来对文件做预处理。这样 webpack 就可以打包任何静态文件。
    • resolve.alias:模块别名,这样可以更方便的引用模块。
    • plugins:如前文介绍,webpack 的一些内置功能均是以插件的形式提供。
  • 前端知识点汇总(持续更新)

    HTML5:

    新增标签元素

    header, footer, aside, nav, section, canvas, video, audio…

    新增 Input 类型

    date, datetime, email, number, range, tel, color…

    本地存储

    生命周期

    • cookie:可设置过期时间
    • localStorage:永久存储
    • sessionStorage:关闭标签页自动清除

    存储大小

    • cookie:4KB
    • sessionStorage:5MB – 10MB
    • localStorage:5MB – 10MB

    作用域

    • cookie:可设置 Domain 和 Path,控制哪些域名和路径可以访问
    • localStorage:同源策略下的所有窗口和标签页共享
    • sessionStorage:仅当前标签页有效,即使同源的其他标签页也无法访问

    <script> 加载方式

    • 默认同步阻塞 HTML 解析
    • defer 延迟执行直至DOM解析完后
    • async 异步引入,下载完成后立即执行

    CSS3:

    新增属性

    • 边框:border-radius, box-shadow, border-image
    • 背景:background-size, background-origin
    • 文字:text-shadow
    • transfrom:translate, rotate, scale, skew, matrix

    自定义字体:@font-face

    动画

    rgba 颜色 / 线性渐变
    .test {
      background-color: rgba(0, 0, 0, 0.5);
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
    }

    flex 布局

    媒体查询

    命名规范

    BEM

    JS:

    小数精度处理

    • 使用 toFixed 取后几位小数
    • 把小数转为整数再进行运算
    • 使用精度运算库,如:big.js

    for…in 和 for…of 的区别

    • for-in 历遍对象,通常获取 key(类似 Object.keys)
    • for-of 历遍可迭代对象,如 Array、Map、Set 等

    任务队列(Task Queue)

    • 先执行同步再执行异步
    • 核心作用:处理异步代码的调度和执行
    • 宏任务:setTimeout、setInterval、I/O 等
    • 微任务:Promise 回调(.then / .catch/ .finally)、MutationObserver 回调等
    • 微任务优先级高于宏任务
    • 调用 fetch 会同步执行并立即返回一个 promise

    call | apply | bind

    均用于改变函数内部 this 的指向

    const obj = { name: "Alice" };
    
    function greet() {
      console.log(`Hello, ${this.name}!`);
    }
    
    greet.call(obj);      // Hello, Alice!
    greet.apply(obj);     // Hello, Alice!
    const boundGreet = greet.bind(obj);
    boundGreet();         // Hello, Alice!

    ES:

    有哪些新特性?

    变量声明

    let 和 const

    箭头函数

    简化函数语法,自动绑定 this

    模板字符串

    `Hello ${name}`

    解构赋值

    const { age, name } = user;
    const [first, second] = [1, 2];

    默认参数

    扩展运算符

    const arr1 = [1, 2];
    const arr2 = [...arr1, 3]; // [1, 2, 3]; // 合并数组
    const objCopy = { ...originalObj }; // 合并对象

    Promise 和 异步处理

    Promise.all – 等待所有 Promise 对象都执行完成 Promise.race – 返回第一个完成的 Promise(无论成功失败) Promise.any – 返回第一个成功的 Promise

    模块化:import 和 export

    Set, Map

    let s = new Set(); s.add(‘a’).add(‘b’)
    let m = new Map(); m.set(’age’, 16)

    数组的 includes,检查是否包含某元素

    async / await

    Generator 函数的语法糖,省去手动 next() 的步骤

    Object.values() 和 Object.entries()

    Object.values({ a: 1, b: 2 }); // [1, 2]
    Object.entries({ a: 1, b: 2 }); // [["a", 1], ["b", 2]]

    字符串填充:padStart() 和 padEnd()

    "5".padStart(2, "0"); // "05"

    空值合并运算符

    const value = input ?? "default";

    动态导入模块

    const module = await import('./module.js')

    replaceAll 替换所有匹配的子串

    "a.b.c".replaceAll(".", "-"); // "a-b-c"

    require 和 import

    • 分别属于 CommonJS 和 ES 两种不同模块系统
    • require 动态加载,运行时解析
    • import 静态加载,编译时解析
    • Proxy
      • 数据绑定与响应式系统:通过 set 拦截属性赋值,触发副作用(如重新渲染)
      • 属性访问控制和校验:限制对象属性的访问或赋值

    微信小程序:

    OpenID & UnionID

    OpenID

    • 用户在当前小程序中的唯一标识
    • 用途:用于识别用户在当前小程序内的身份(如用户数据存储、业务逻辑处理)
    • 获取:通过 wx.login() 获取 code,后端用 code 调用微信接口换取 OpenID

    UnionID

    • 用户在微信的唯一标识
    • 用途:实现跨小程序、公众号用户身份统一
    • 获取:通过 wx.getUserInfo() 获取 encryptedData, iv,发送到后端解密,或者通过按钮触发授权

    性能优化:

    • 文本压缩(css, js, html)
    • 图片压缩
    • 合并资源(合并文本、雪碧图)
    • 图片懒加载
    • 合并请求
    • 缓存资源(设置浏览器头、设置 html head)
    • 使用 CDN
    • gzip 压缩
    • 减少 DOM 操作
    • CSS 样式置顶、JS 脚本置底
    • 防抖和节流
      • 防抖:保证N秒内执行一次,如果N秒内触发将再执行并重新计算时间
      • 节流:保证N秒内只能触发一次
  • 2016 唯品会七周年年会

    我们唯品会7周年年会,也太热闹啦!

    2016年,咱们唯品会7周年年会在广州体育馆举办,现场人挤人、超热闹,比去年在天河体育中心办的还要有氛围,一眼望过去全是咱们同事,特别有归属感。

    说真的,公司这几年是真的越变越好,作为基层职员,我们每天上班都能实实在在感受到这份变化。这次年会也办得特别用心,场馆布置得亮亮堂堂的,灯光一打开,简直跟演唱会一样气派,看得出来公司是真的想陪我们好好庆生。

    现场超有看头,不光有我们同事自编自演的节目,居然还请到了杨宗纬!他一开口唱歌,全场瞬间就嗨了,我们跟着一起大合唱,气氛直接拉满,那种热闹劲儿,现在想起来还很激动。

    最让人期待的就是抽奖环节了!这次公司是真大方,奖品多到数不过来,中奖率也超高,iPhone 6s、唯品卡、马尔代夫双人游全都有,最厉害的是居然还有6台豪车当大奖,简直太惊喜了!

    不知不觉,我在公司已经工作三年了,看着公司走过7个年头,心里还挺感慨的。真心希望公司业务越来越好,我们也能跟着公司一起,越来越好、越来越有奔头!

  • 【JS】事件循环(Event Loop)

    核心概念

    事件循环是 JavaScript 处理异步操作的机制,它使得单线程的 JS 能够实现非阻塞 I/O 操作。

    三大关键组成部分

    1. 调用栈(Call Stack):

      • 执行同步代码的地方
      • 后进先出(LIFO)结构
    2. 任务队列(Task Queues):

      • 宏任务队列:setTimeout、setInterval、I/O 等
      • 微任务队列:Promise.then、MutationObserver 等
    3. 事件循环机制:

      • 不断检查调用栈和任务队列
      • 决定何时执行哪个任务

    执行流程

    1. 从宏任务队列取出一个任务执行(如 script 整体代码)
    2. 执行过程中:
      • 同步代码立即执行
      • 遇到异步操作,注册相应回调
    3. 当前宏任务执行完毕:
    • 立即执行所有微任务
    • 如果微任务产生新微任务,继续执行直到队列清空
    1. 必要时进行UI 渲染
    2. 从宏任务队列取下一个任务,开始新循环

    执行顺序示例

    console.log('1. 同步代码'); // 同步
    
    setTimeout(() => console.log('4. 宏任务'), 0); // 宏任务
    
    Promise.resolve().then(() => console.log('3. 微任务')); // 微任务
    
    console.log('2. 同步代码'); // 同步
    
    /* 输出顺序:
    1. 同步代码
    2. 同步代码
    3. 微任务
    4. 宏任务
    */

    重要特点

    • 微任务优先级高于宏任务:每执行完一个宏任务,就会清空微任务队列
    • 避免阻塞:长时间同步代码会阻塞事件循环
    • 不同环境差异:Node.js 与浏览器实现有细微差别

    理解事件循环是掌握 JavaScript 异步编程的基础,有助于编写高效、无阻塞的代码。

  • K9068 广州->佛山

    看百度地图心血来潮,决定不坐地铁,改乘火车回佛山,编号K9068,票价¥9。

    我从广州站出发,本以为暑期旅游专线会人满为患,没想到车上乘客基本都在广州下车,上车发现车厢里空空荡荡,几乎只有我一人(又可以包车^_^)。可是上车后我没习惯性地掏出手机到处拍,因为车厢卫生实在太难以形容,弥漫着方便面的气味。

    虽然只有短短的二十分钟车程,但这趟旅程让我感受到了不同于地铁的体验。没有拥挤的人潮,没有匆忙的脚步,只有窗外飞逝的风景和车厢里难得的宁静。

    列车到达佛山站。只见零星几个旅客下车。这也是我第一次来到佛山站,一个中式风格的老旧火车站。总体感觉还好,主要车程短人还少。

  • Linux 常用命令完整大全

    目录

    1. 文件与目录操作
    2. 文件查看/编辑
    3. 权限与用户组
    4. 进程与系统监控
    5. 磁盘/挂载/文件系统
    6. 网络操作
    7. 软件包管理(CentOS/RHEL & Ubuntu/Debian)
    8. 压缩解压
    9. 文本处理三剑客:grep / sed / awk
    10. 系统信息、时间、环境变量
    11. 远程连接与文件传输
    12. 服务管理(systemd)
    13. 快捷辅助命令

    一、文件与目录操作

    命令 作用 常用示例
    pwd 打印当前工作目录 pwd
    cd 切换目录 cd /etc、cd ~ 回家目录、cd - 返回上一级目录
    ls 列出目录内容 ls -l 详细列表、ls -a 显示隐藏文件、ls -lh 人性化大小
    mkdir 创建目录 mkdir test、mkdir -p a/b/c 递归创建多级目录
    rmdir 删除空目录 rmdir test
    rm 删除文件/目录 rm file.txt、rm -rf dir 强制递归删除(慎用)
    cp 复制文件/目录 cp a.txt /tmp/、cp -r dir1 dir2 复制文件夹
    mv 移动/重命名 mv old.txt new.txt、mv file /home/
    touch 创建空文件/更新时间戳 touch log.txt
    ln 创建软硬链接 ln -s /etc/hosts link_hosts 软链接
    find 查找文件 find / -name "*.log"、find . -size +100M 查找大于100M文件

    二、文件查看/编辑

    命令 作用 常用示例
    cat 一次性读取全部文件 cat info.txt、cat > new.txt 写入内容
    more 分页浏览(只能下翻) more access.log
    less 分页浏览(上下翻、搜索) less nginx.log
    head 查看文件前N行 head -20 test.log 前20行
    tail 查看末尾N行、实时跟踪日志 tail -f nginx.log 实时刷新、tail -n 50 log
    wc 统计行数、单词、字符 wc -l file.txt 统计行数
    du 查看目录占用磁盘 du -sh * 当前目录各文件夹大小
    vim / vi 终端文本编辑器 vim nginx.conf
    nano 简易轻量编辑器 nano test.txt

    三、权限、用户、用户组

    命令 作用 常用示例
    chmod 修改文件权限 chmod 755 run.sh、chmod +x run.sh 添加执行权限
    chown 修改文件属主/属组 chown root:root test.txt
    useradd 创建用户 useradd admin
    userdel 删除用户 userdel -r admin 连带家目录删除
    passwd 修改密码 passwd root
    groupadd 创建用户组 groupadd dev
    usermod 修改用户附属组 usermod -aG docker root
    id 查看当前用户UID/GID id
    who / w 查看登录用户 w 显示登录用户及操作
    su 切换用户 su root
    sudo 临时以管理员执行 sudo systemctl restart nginx

    四、进程与系统监控

    命令 作用 常用示例
    ps 查看进程快照 ps -ef、ps aux
    top 实时进程资源监控 top
    htop 增强版top(需安装) htop
    kill 终止进程 kill 1234、kill -9 1234 强制杀死
    pkill 按进程名杀死 pkill nginx
    nice / renice 调整进程优先级 nice -n -10 ./app
    free 查看内存使用 free -h 人性化单位
    vmstat 虚拟内存、IO状态 vmstat 2 每2秒刷新
    uptime 系统运行时长、负载 uptime

    五、磁盘、挂载、文件系统

    命令 作用 常用示例
    df 磁盘分区使用率 df -h
    mount 挂载磁盘/镜像 mount /dev/sdb1 /data
    umount 卸载挂载点 umount /data
    fdisk 磁盘分区工具 fdisk -l 列出所有磁盘
    blkid 查看磁盘UUID blkid
    fsck 文件系统修复(卸载后执行) fsck /dev/sdb1

    六、网络操作

    命令 作用 常用示例
    ip 新版网络工具(替代ifconfig) ip a 查看网卡、ip route 路由表
    ifconfig 旧网卡信息工具 ifconfig eth0
    ping 连通性测试 ping baidu.com
    netstat 查看端口、连接 netstat -tulnp 监听端口
    ss 替代netstat,更快 ss -tulnp
    curl 网络请求工具 curl https://www.baidu.com
    wget 文件下载 wget https://xxx/file.zip
    telnet 端口连通测试 telnet 127.0.0.1 80
    traceroute 路由追踪 traceroute baidu.com
    host / nslookup DNS解析 nslookup www.qq.com

    七、软件包管理

    1)CentOS / RHEL / Rocky Linux(yum/dnf)

    命令 作用
    yum list installed 列出已装软件
    yum install nginx 安装软件
    yum remove nginx 卸载
    yum update 全系统升级
    yum search mysql 搜索软件包
    rpm -ivh xxx.rpm 本地rpm包安装
    rpm -qa | grep nginx 查询是否安装

    2)Ubuntu / Debian(apt)

    命令 作用
    apt update 更新软件源缓存
    apt install nginx 安装
    apt remove nginx 卸载
    apt full-upgrade 系统升级
    apt search nginx 搜索包
    dpkg -i xxx.deb 本地deb安装

    八、压缩解压

    命令 格式 示例
    tar -zcvf tar.gz 打包压缩 tar -zcvf file.tar.gz dir/
    tar -zxvf 解压tar.gz tar -zxvf file.tar.gz
    tar -jcvf tar.bz2 tar -jcvf file.tar.bz2 dir
    unzip zip解压 unzip file.zip
    zip -r zip压缩文件夹 zip -r out.zip dir
    gzip 单文件压缩 gzip test.txt

    九、文本三剑客:grep / sed / awk

    命令 作用 示例
    grep 文本匹配搜索 grep "error" nginx.log、grep -v "info" 排除匹配行
    sed 流编辑器,替换/删除 sed 's/old/new/g' file.txt 全局替换
    awk 结构化文本统计、切割 awk '{print $1}' log.txt 打印第一列

    十、系统信息、时间、环境变量

    命令 作用
    uname -a 内核、系统版本
    hostname 主机名
    hostnamectl 修改主机名(systemd)
    date 当前系统时间
    timedatectl 时区时间管理
    env / printenv 查看环境变量
    echo $PATH 打印PATH变量
    history 查看历史执行命令
    clear 清屏

    十一、远程连接 & 文件传输

    命令 作用 示例
    ssh 远程登录服务器 ssh root@192.168.1.100
    scp 服务器之间传文件 scp local.zip root@ip:/tmp/
    sftp 交互式远程文件传输 sftp root@ip
    rsync 增量同步文件(备份首选) rsync -avz dir/ root@ip:/data/

    十二、Systemd 服务管理(主流 Linux)

    命令 作用
    systemctl start nginx 启动服务
    systemctl stop nginx 停止
    systemctl restart nginx 重启
    systemctl enable nginx 开机自启
    systemctl disable nginx 关闭自启
    systemctl status nginx 查看运行状态
    systemctl list-units --type=service 列出所有服务
    journalctl -u nginx 查看服务日志

    十三、开关机、权限辅助、管道重定向

    命令 说明
    reboot 重启服务器
    shutdown -h now 立即关机
    shutdown -r 10 10分钟后重启
    > 输出覆盖文件:echo 123 > a.txt
    >> 追加写入文件:echo abc >> a.txt
    \| 管道,传递输出:ps aux \| grep nginx
    & 后台运行进程:./app &
    nohup 脱离终端后台运行:nohup ./app &
    alias ll='ls -lh' 设置命令别名

    十四、高危命令警示(务必谨慎)

    1. rm -rf / 清空整个系统,绝对禁止
    2. dd if=/dev/zero of=/dev/sda 清空整块硬盘
    3. chmod 777 所有用户完全读写执行,存在安全漏洞
    4. kill -9 1 强制杀死systemd/init,服务器直接宕机