vue.config和editorconfig

旧城等待, 2021-08-28 18:58 462阅读 0赞

我们在做项目的时候,应该给经常用到的文件配置它的别名,这样做,既可以方便引用,也可以防止当文件位置发生改变的时候出现错误。

  1. 配置前:
  2. import bartar from '../../components/bartar'
  3. 配置后(不用再关心文件层级关系):
  4. import bartarfrom 'components/bartar'
  5. **那么,我们应该如何进行配置呢?**
  6. 在根目录下,创建一个vue.config.js文件,添加如下代码:
  7. module.exports= \{
  8. configureWebpack: \{
  9. resolve: \{
  10. alias: \{
  11. 'assets':'@/assets',
  12. 'common':'@/common',
  13. 'components':'@/components',
  14. 'network':'@/network',
  15. 'views':'@/views'
  16. \}
  17. \}
  18. \}

}

EditorConfig是什么

在项目里,大多时候都能看到.editorconfig文件,刚开始总是忽视掉它,认为它不太重要。但是,它的存在,必定有它的理由,于是,抽空来研究一下,它是什么,能做什么。

官网是这么介绍EditorConfig的,“EditorConfig帮助开发人员在不同的编辑器和IDE之间定义和维护一致的编码样式。EditorConfig项目由用于定义编码样式的文件格式和一组文本编辑器插件组成,这些插件使编辑器能够读取文件格式并遵循定义的样式。EditorConfig文件易于阅读,并且与版本控制系统配合使用。”

不同的开发人员,不同的编辑器,有不同的编码风格,而EditorConfig就是用来协同团队开发人员之间的代码的风格及样式规范化的一个工具,而.editorconfig正是它的默认配置文件。

帮助开发者在不同IDE中保持一致的代码风格。工程中有.editorconfig配置文件及使用的IDE默认支持EditorConfig或安装插件支持即可。(VSCode是安装插件支持)

  1. # 告诉EditorConfig插件,这是根文件,不用继续往上查找
  2. root = true
  3. # 匹配全部文件
  4. [*]
  5. # 结尾换行符,可选"lf"、"cr"、"crlf"
  6. end_of_line = lf
  7. # 在文件结尾插入新行
  8. insert_final_newline = true
  9. # 删除一行中的前后空格
  10. trim_trailing_whitespace = true
  11. # 匹配js和py结尾的文件
  12. [*.{js,py}]
  13. # 设置字符集
  14. charset = utf-8
  15. # 匹配py结尾的文件
  16. [*.py]
  17. # 缩进风格,可选"space"、"tab"
  18. indent_style = space
  19. # 缩进的空格数
  20. indent_size = 4
  21. # 以下匹配,类同
  22. [Makefile]
  23. indent_style = tab
  24. # tab的宽度
  25. tab_width = 4
  26. # 以下匹配,类同
  27. [lib/**.js]
  28. indent_style = space
  29. indent_size = 2
  30. [{package.json,.travis.yml}]
  31. indent_style = space
  32. indent_size = 2

1、如果是windows用户,如果无法创建.editorconfig文件,则需要先创建.editorconfig.文件,系统会自动重命名成.editorconfig文件。

2、EditorConfig的匹配规则是从上往下,即先定义的规则优先级比后定义的优先级要高。

3、插件安装,在GitHub上已经有了各种流行编辑器的插件源代码,可根据说明安装。

4、对于VS Core,对应的插件名是EditorConfig for VS Code。

5、这里列举了VS Code支持的规则:

  • indent_style
  • indent_size
  • tab_width
  • end_of_line
  • insert_final_newline
  • trim_trailing_whitespace

发表评论

表情:
评论列表 (有 0 条评论,462人围观)

还没有评论,来说两句吧...

相关阅读

    相关 .editorconfig

    *.editorconfig 是什么?**           在团队开发过程中,同一个项目不同的开发人员可能会使用不同的开发工具,比如Web网页开发,有些开发者会使用...

    相关 editorConfig编辑器配置

    当多人团队进行一个项目开发时,每个人可能喜欢的编辑器不同,有人喜欢Webstrom、有人喜欢sublime、还有人喜欢Hbuilder。这个时候,问题便迎面而来,如何帮助开发人

    相关 .editorconfig文件生效

    它是一个代码提示工具,规范代码,让使用不同编辑器的开发者在共同开发一个项目时“无痛”地遵循编码规范 在vsCode 编辑器里要进行配置 点击查看-》扩展-》搜索editor

    相关 vue.configeditorconfig

    我们在做项目的时候,应该给经常用到的文件配置它的别名,这样做,既可以方便引用,也可以防止当文件位置发生改变的时候出现错误。         配置前:         imp