🔰 前端编辑器常见配置文件
!本篇文章过于久远,其中观点和内容可能已经不准确,请见谅!~
想分享的是现代前端复杂的工程化方案,其中需要的各种配置文件,应该没有几个文件没见过吧~ 每次新技术、新需求来临,大呼学不动了的你,看到这些又要披上战甲、拿起键盘冲啊!!!
下面的表格是按照自己几个项目里面用到的一些方案的文件,也算是目前常见的一些了,具体基本上根据文件名就能看出是什么的配置了:
name | tech | desc |
---|---|---|
package.json | npm | node 包的配置,现在发展为前端通用的项目配置文件 |
.eslint.json / .eslint.js / .eslintrc / .eslintrc.js | ESlint | 语法、问题、风格检查和自动修复 |
.lintstagedrc / lint-staged.config.js | lint-staged | 配合 Git 来过滤修改的文件,以便做提交前检查 |
.huskyrc | husky | 实现 git hook 方便在 git 的处理阶段处理 |
.eslintignore | ESlint | ESlint 忽略检查的文件 |
.perttierrc / .prettier.config.js / .prettierignore | prettier | 代码风格化工具 |
.babelrc | Babel | 语法编译工具,新语法编译为浏览器兼容版本,前端发展的基石 |
.browserslistrc | browserslist | 指定目标浏览器,很多插件比如 babel 根据这个配置来确认编译目标 |
.env / .envrc / .env.development / .env.production / .env.production.local | 环境变量 | 一般通用的环境变量文件 |
.gitignore | Git | Git 忽略文件列表 |
.nvmrc / .node-version | avn avn-nvm | avn 使用 nvm 自动切换项目下node 版本 |
jest.config.js | jest | 一个前端测试支持库 |
tsconfig.json | TypeScript | TS 语法支持的配置文件 |
yarn.lock | Yarn | Yarn 的依赖文件锁 |
package-lock.json | NPM | NPM 的依赖文件锁 |
.vscode | VSCode | 编辑器工作区配置文件 |
lerna.json | Lerna | Lerna 前端包项目微架构配置文件 |
typings.d.ts | TypeScript | TS 全局声明文件 |
.gitlab-ci.yml | Gitlab | Gitlab 持续继承服务 |
AUTHORS / README.md / HISTORY.md / CONTRIBUTING.md / COPYING / LICENCE / CHANGELOG.md | Docs | 常见的项目文档 |
.travis.yml | travis | Travis 持续继承配置 |
.npmignore | NPM | 打包忽略文件 |
rollup.config.js | rollup | rollup 配置文件入口 |
webpack.config.js | webpack | webpack 配置文件入口 |
常见文件夹,这个不同的项目结构用处不同,但是大部分文件夹名安排相似:
name | usage |
---|---|
node_modules | npm 依赖文件夹 |
src | 源码 |
config | 项目脚本配置文件 |
build | 构建脚本 |
dist | 导出目录 |
vendor | 第三方库 |
src/pages | 页面分割 |
src/components | 组件文件夹 |
src/static | 静态文件夹,不编译 |
src/assets | 资源文件夹,需编译 |
src/utils | 支持工具库 |
src/apis | 网络请求 |
src/models | 数据模型 |
libs、plugins、views、styles、theme、layout、imgs | 其他文件名 |
列出来的这些只是一部分,所以能看出来前端界目前的工具支持生态多么的丰富,越来越复杂的前端配置也正说明了光初始化一个项目就需要不少精力。
术业有专攻,项目中每个需求,都能引入一个工具支持,相关的配置和用法官网和社区都有详细的文档,甚至编辑器支持 json schema 也能提供一定程度的语法提示,所以这也是说明需求逐渐细化的目前前端生态特点。
每次新技术、新需求来临,大呼学不动了的你,看到这些又要披上战甲、拿起键盘冲啊
感谢您的阅读,本文由 Ubug 版权所有。如若转载,请注明出处:Ubug(https://ubug.io/blog/config-files)