规范化标准

最新推荐文章于 2023-12-31 01:37:59 发布

潘小盒

最新推荐文章于 2023-12-31 01:37:59 发布

阅读量157

点赞数

分类专栏：学习笔记文章标签：前端

本文链接：https://blog.csdn.net/weixin_52054631/article/details/115692001

版权

本文探讨了前端代码规范化的重要性，介绍了如何在项目中使用ESLint、StyleLint和Prettier来确保代码质量。详细讲解了ESLint的配置、自动化集成以及与Webpack和Git Hooks的结合使用，同时提到了TypeScript的ESLint校验和代码格式化工具。

摘要由CSDN通过智能技术生成

规范化标准

为什么需要规范化

不同开发者有不同的编码习惯和喜好，多人协作开发时需要明确统一的标准。

哪里需要规范化标准

代码、文档、日志等开发过程中人为编写的产物，其中代码标准化规范最为重要。

实施规范化的方法

编码前人为约定
使用工具 Lint

ESLint

最为主流的JS Lint工具，用来监测JS代码质量

使用

新建项目，初始化package.json yarn init --yes
安装 yarn add eslint --dev
初始化配置文件 .eslintrc.js，yarn eslint --init
yarn eslint 文件路径 对指定文件进行校验

配置文件

module.exports = {
   
  // 运行环境，可以同时开启多个不同的环境
  env: {
   
    browser: true,
    es2020: true
  },
  // 继承公共的配置模块，可以继承多个
  extends: [
    'standard'
  ],
  // 指定语法解析器
  parser: '@typescript-eslint/parser',
  // 语法解析器的相关配置，控制是否允许使用某个版本的es语法 
  parserOptions: {
   
    ecmaVersion: 11
  },
  // eslint校验规则的开启/关闭，属性名为eslint内置规则名称，值可以是 off/warn/error 或 0/1/2
  rules: {
   
    'no-alert': 'error'
  },
  // 指定使用的插件
  plugins: [
  
  ],
  // 额外地声明代码中可以使用的全局成员
  globals: {
   
    "$": 'readonly'
  }