dotenv
dotenv 是一个开源，没有依赖的 npm 包。它的作用是避免把自己的数据库连接方式提交到 github，变成公开的
使用上在开发环境，可以在根目录下新建 .env 的配置文件，里面去写数据库连接方式的环境变量，在 .gitignore 中配置这个文件不被提交到 git 上，在生产环境，通过在打包时注入环境变量的方式，配置数据库的连接方式，详细的配置见上一篇文章
但是像比较基础设施比较完备的公司，有自己的 git 私有化部署，就不需要这个工具了，直接把数据库连接配置提交到 git 上也是没问题的
React Fast Refresh
what is react fast refresh
react fast refresh 是 react 官方支持的一个热更新方案，之前被用到 react native，因为底层的实现是相同的，于是也可以被用到 web，但是需要和已有的工具比如 webpack 集成（已经有插件）
fash refresh 实时更新，可以保存组件的状态（函数组件），并且可以在程序编译出错时，在屏幕上覆盖展示错误信息
dan 的回复：github.com/facebook/re…
how to use
在开发环境配置 webpack 的插件：github.com/pmmmwh/reac…
注意因为 react-refresh 包的限制，react 版本需大于 16.9.0
compare with react-hot-loader
react fast refresh 是 react 官方支持的热更新工具，react-hot-loader 的 readme 也在推荐迁移到 fast refresh，不再用 hot loader 了
try it！
// webpack.config.js
const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin'); // 新增
{
test: /\.tsx?$/,
use: [{
loader: require.resolve('babel-loader'),
options: {
plugins: [require.resolve('react-refresh/babel')] // 新增
}
}, 'ts-loader'],
exclude: /node_modules/,
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new ReactRefreshWebpackPlugin(), // 新增
],
没有生效可能的原因
参考：www.gatsbyjs.com/docs/refere…
