create-react-app如何配置@修飾器功能

用create-react-app生成項目後，默認是不支持@修飾器的，
如果我們需要使用@修飾器，比如使用mobx時，應該如何配置呢？
網上看了很多資料，基本都是關於 babel6 及以下版本的方案，
所以寫了這篇文章，專門說說 babel7+ 版本如何配置

1.暴露配置文件
使用create-react-app生成項目後，
執行yarn eject，將 webpack 配置文件暴露出來。

2.修改配置文件
修改/config/webpack.config.dev.js和/config/webpack.config.prod.js文件，
兩個文件的修改內容相同，都是添加兩行代碼，如下

{
  test: /\.(js|mjs|jsx|ts|tsx)$/,
  include: paths.appSrc,
  loader: require.resolve('babel-loader'),
  options: {
    // ... 省略其他代碼
    plugins: [
      // ！！要添加以下兩行代碼：
      ["@babel/plugin-proposal-decorators", { "legacy": true }],
      ["@babel/plugin-proposal-class-properties", { "loose": true }],
      // ... 省略其他代碼
    ],
    // ... 省略其他代碼
  },
  // ... 省略其他代碼
}

注意插件排序：@babel/plugin-proposal-decorators應該是插件列表中的第一個插件

3.安裝依賴包:
npm install --save-dev @babel/plugin-proposal-decorators babel-plugin-transform-decorators-legacy

4.萬事大吉
是不是很簡單，此時執行npm start，項目就跑起來了，快試試吧