前端工程化之规范化标准

规范化标准

在前端快速发展的今天，如果不能时刻保持学习就会很快被淘汰。分享一下前端工程化中有关于规范化标准的相关知识。每天进步一点点。

一、规范化概述

规范化是我们践行前端工程化中重要的一部分。

1、为什么要有规范化标准

软件开发需要多人协同

不同开发者具有不同的编码习惯和喜好

不同的喜好增加项目维护成本

每个项目或者团队需要明确统一的标准

2、哪里需要规范化标准

代码、文档、甚至是提交日志

开发过程中人为编写的成果物

代码标准化规范最为重要

3、实施规范化的方法

编码前人为的标准约定

通过工具实现 Lint

4、常见的规范化实现方式

ESLint 工具使用

定制 ESLint 校验规则

ESLint 对 TypeScript 的支持

ESLint 结合自动化工具或者 Webpack

基于 ESLint 的衍生工具

Stylelint 工具的使用

二、ESLint 介绍

最为主流的 JavaScript Lint 工具 监测 JS 代码质量

ESLint 很容易统一开发者的编码风格

ESLint 可以帮助开发者提升编码能力

三、ESLint 安装

初始化项目

安装 ESLint 模块为开发依赖

通过 CLI 命令验证安装结果

四、ESLint 快速上手

1、ESLint 检查步骤

编写“问题”代码

使用 eslint 执行检测

完成 eslint 使用配置

2、ESLint 配置文件解析

.eslintrc.js 配置文件：

module.exports = {
  env: {
    browser: true,
    es2021: true
  },
  extends: [
    'standard'
  ],
  parserOptions: {
    ecmaVersion: 12
  },