elementui开发文档(elementui 样式)

这本书跟随正文。在团队协作中，为了避免底层bug以及团队协作中不同代码风格带来的麻烦和影响，会提前制定编码规范。通过使用Lint工具和代码风格检测工具，可以辅助代码规范执行，格式化代码，保持风格与规则一致，有效控制代码质量，实现项目代码风格的统一。在代码格式化方面，Prettier和ESLint有所重叠，但侧重点不同：ESLint可以提供有限的格式化功能；更漂亮的在格式化代码上有更大的优势。而Prettier的设计是为了方便与ESLint集成，所以在项目中使用两者时，不用担心冲突。
0x00。更漂亮概述配置文件更漂亮支持以下优先级顺序的多个配置文件：
在package.json中创建一个更漂亮的属性，并在那里定义您的配置。使用。prettierrc，你可以做JSON或者YAML。使用. pretierrc.json、 pretierrc.yml、 pretierrc.yaml、 pretierrc.json5定义配置结构。使用. pretierrc.js、 pretierrc.cjs、pretier.config.js、appeller . config . cjs来定义配置结构——必须使用module.exports来公开对象。使用prettierrc.toml定义配置结构.pretierignore在根目录下添加一个. pretierignore文件，实现文件级忽略(语法同。gitignore)。
自动CRLF解决了跨系统差异问题。Windows使用回车(CR)和换行符(LF)两个字符来结束一行，而macOS和Linux只使用换行符(LF)一个字符，这将极大地干扰跨平台协作。Unix/Mac用户
Windows用户
0x01。eslint的概况ESLint支持多种概况：
JavaScript——使用eslintrc.js，然后输出一个配置对象。YAML-使用eslintrc.yaml或eslintrc.yml定义配置的结构。JSON——使用ESLintrc.json定义配置的结构。eslint的JSON文件允许JavaScript风格的注释。(已弃用)-使用。eslintrc，你可以做JSON或者YAML。Package.json——在package . JSON中创建一个eslintConfig属性，并在那里定义您的配置。如果同一个目录中有多个配置文件，ESLint将只使用一个。优先级顺序如下：eslintrc . js . eslintrc . YAML . eslintrc . yml . eslintrc . JSON . eslintrc package . JSON配置文件通用属性根环境解析器选项解析器扩展插件规则和其他函数配置如下：
属性rooteslint将在所有父目录中查找配置文件，一直到根目录。一旦在配置文件中找到“root”: true，它将停止在父目录中查找。
env属性使用env关键字指定要启用的环境，并将它们设置为true。环境不是互斥的，因此可以同时定义多个环境。可用环境的更多列表
ParserOptions属性parserOptions是使用parse options属性设置的。可用选项包括：
ECMA version-默认设置为3，5(默认值)。您可以使用6、7、8、9或10来指定想要使用的ECMAScript版本。还可以用以年份命名的版本号指定2015(同6)、2016(同7)、2017(同8)或2018(同9)或2019(同10)——设置为’ script ‘(默认)或’ module ‘(如果你的代码是ECMAScript module)。ECMA features-这是一个对象，指示您要使用的附加语言功能： global return-允许return语句在全局范围内隐含strict-启用全局strict模式(如果ecmaVersion为5或更高)jsx-启用JSX experimentalobjectestspread-启用实验对象rest/spread属性支持。(重要提示：这是一个实验功能，将来可能会有显著变化。建议你写的规则不要依赖这个函数，除非你愿意承担它变化时的维护成本。)parser属性在配置文件中指定了一个不同的分析器。使用自定义解析器时，为了让ESLint在处理非ECMAScript 5特性时正常工作，仍然需要配置属性解析选项。解析器将被传递到parserOptions中，但是它们可能不用于确定功能特性的切换。
extends属性扩展配置并通过声明启用规则。扩展的属性值可以是：
指定配置的字符串数组(配置文件的路径、可共享配置的名称、eslint:recommended或eslint:all):每个配置都继承其前面扩展的配置的属性值。可以使用短名称，省略包名的前缀eslint-config-。
为extends属性启用一系列核心规则，其值为“eslint:recommended”，标记为。为值为“eslint:all”的extends属性启用当前安装的ESLint中的所有核心规则，不建议在产品中使用。
插件属性插件是一个npm包，通常输出规则。一些插件还可以输出一个或多个命名的配置。插件属性值可以使用短名称，省略包名的前缀eslint-plugin-。
包配置插件指定configs项下的包配置，并支持多种配置。
示例插件命名为eslint-plugin-myPlugin，那么myConfig和myOtherConfig的配置可以分别从‘plugin : my plugin/my config’和‘plugin 3360 my plugin/myOtherConfig’扩展而来。此时，extends属性的值由以下内容组成：插件：包名(省略前缀myplugin配置名(myConfig)。
默认情况下，配置不会启用插件中的任何规则。您必须在plugins数组中指定插件名称，并指定要在extends数组中使用的插件中的规则。任何插件中的规则都必须有插件名称或其缩写前缀。
插件中的正式文档配置
Rules属性rules属性启用附加规则并更改规则的级别和选项。要更改规则设置，您必须将规则ID设置为下列值之一：
‘ Off ‘或0-关闭规则’ warn ‘或1-打开规则，使用警告级别错误：warn(不会导致程序退出)’ error ‘或2-打开规则，使用错误级别错误：error(当被触发时，程序将退出)。eslintignore告诉ESLint忽略特定的文件和。eslintignore文件是一个纯文本文件，其中每一行都是一个glob模式，指示检测时应该忽略哪些路径。
0x02。在项目中安装更漂亮的配置。
在根目录下创建prettierrc.js配置文件。
在根目录下创建一个. prettierignore文件。
执行命令来格式化整个项目。
成功执行后，输出文件列表，格式化后的文件名以白色突出显示。
Eslint配置并安装eslint及相关插件ESLint-Config-beauty ESLint-Plugin-beauty ESLint-Plugin-Vue，让beauty和ESLint更好的协同工作。
在根目录中创建eslintrc.js配置文件。
lint-config-pretier 8 . 0 . 0版以后，直接声明’ pretier ‘就可以使用所有插件了。8.0.0更新日志github.com/prettier/es…github.com/prettier/es…
创建一个。根目录中的eslintignore文件。
项目运行后，如果文件格式不符合规范，编辑器窗口会提示。
将光标移动到问题行，将显示问题类型。您可以单击快速修复选项来修复问题。
web loader ide插件将直接显示文件格式问题。为了直接在编译窗口显示问题，安装eslint-web pack-plugin(eslint-loader已被放弃)插件。
更新build\webpack.config.js的内容.
项目未能编译。进入问题列表，点击快速定位。(如果问题在编译时自动修复，请在插件中将fix:设置为true。)
最新目录结构0x03。示例代码Github Repo作者：Andurils链接：https://juejin.cn/post/6951808773354684447来源：掘金版权归作者所有。商业转载请联系作者授权，非商业转载请注明出处。