一、什么是 indra？
indra 是一个集成了前端开发中常用工具的 npm 包，包括 webpack、babel、eslint、postcss、lint-staged 等。它能够帮助我们快速搭建前端开发环境，提高我们的开发效率和代码质量。
二、安装 indra
在终端中输入以下命令进行安装：
npm install indra -g
三、如何使用 indra？
1. 初始化项目
在终端中进入要初始化项目的目录，输入以下命令进行初始化：
indra init
然后会提示你输入项目名称和描述，输入之后就会自动创建一个包含 webpack 配置、eslint 配置等文件的基础项目结构。
2. 配置文件修改
indra 默认的配置文件已经集成了常用的工具，一般情况下无需修改。若要修改，可以在项目根目录中找到 indra.json 配置文件进行修改。
3. 启动项目
在终端中输入以下命令进行项目启动：
npm run dev
然后就可以在浏览器中访问 http://localhost:8080 查看项目页面了。
4. 编译打包
在终端中输入以下命令进行项目编译打包：
npm run build
然后 indra 就会自动将整个项目编译成静态文件保存在 dist 目录中。
5. 添加 lint-staged 配置
在配置文件 indra.json 中，我们可以看到常用工具已经配置好了，包括 eslint、babel 等。但是有时为了避免不符合规范的代码提交，我们需要对代码进行 prettier 格式化等操作，这时就需要添加 lint-staged 配置。
在 indra.json 的 scripts 字段下添加以下配置：
"lint-staged": {
"*.{js,css,json,md}": [
"prettier --write",
"git add"
]
}然后在项目中执行 git commit 命令时，会自动对 code、css、json、md 文件进行 prettier 格式化，然后将格式化后的代码 add 到 git 中。
四、使用 indra 的优势
- 快速集成前端开发中常用工具，避免重复造轮子。
- 避免配置文件的繁琐操作，indra 已经为我们配置好了常用的工具，只需要简单的修改配置文件即可。
- 避免繁琐的编译打包操作，只需要简单的执行命令即可编译打包整个项目。
- 避免一些低级错误，例如提交不规范的代码等，通过添加 lint-staged 配置可以在提交代码时自动对代码进行格式化等操作。
- 提高开发效率和代码质量，让我们可以更关注业务逻辑，而不是配置文件和工具的使用。
五、总结
indra 是一个能够帮助我们快速集成前端开发中常用工具的 npm 包，它能够避免繁琐的配置文件操作和编译打包操作，提高了我们的开发效率和代码质量。同时，在 indra.json 配置文件中添加 lint-staged 配置，还能够帮助我们避免一些低级错误的提交，提高代码规范性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005601181e8991b448de044