Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-property-in-object since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-methods.

# 起きたこと
下記を実行
```console
$ npm run storybook
```

なんかでた
```console
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-property-in-object since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-methods.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-property-in-object since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-methods.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-property-in-object since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-methods.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.
(((ここから同じ内容が7回ほど
```
> babel/preset-env の設定で "loose" オプションを "false" にしましたが、@babel/plugin-proposal-private-property-in-object では "loose" モードオプションが "true" に設定されているので、これは使用されないでしょう。
"loose" オプションは @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods と @babel/plugin-proposal-private-property-in-object (これらが有効な場合) で同じでなければなりません。

解決自体は、`["@babel/plugin-proposal-private-property-in-object", { "loose": true }]`をいれることでできそうですね。

## せっかくなので調査

### @babel/preset-env

> babel/preset-env は、ターゲットとなる環境でどの構文変換が必要なのか (オプションでブラウザのポリフィルも) を細かく管理することなく、最新の JavaScript を使用できるようにするスマートなプリセットです。これはあなたの生活を楽にし、JavaScript のバンドルも小さくします!
https://babeljs.io/docs/en/babel-preset-env

なるほど

### loose option

>このプリセット内のプラグインで "ルース" トランスフォームを許可するものがあれば、それを有効にする。
https://babeljs.io/docs/en/babel-preset-env#loose

...？:frowning:

> loose: false - 生成されたコードは、多くのチェックを経て、最も厳密で標準と互換性のあるものが得られます。
https://stackoverflow.com/questions/46445415/what-is-loose-mean-in-babeljs

↑は素晴らしいアンサーがついてます。実際の生成された例が載っている。ぜひみてください。

## 修正

```diff_json:.babelIrc
    [
      "@babel/plugin-proposal-class-properties",
      {
        "loose": true
      }
    ],
    [
      "@babel/plugin-proposal-private-methods",
      {
        "loose": true
      }
    ],
+   ["@babel/plugin-proposal-private-property-in-object",
+     {
+       "loose": true
+     }
+   ],
```

警告が出るか、試します。

```console
$ npm run storybook
```

出なくなりました。

# おまけ
### 構成
```json:package.json
{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "storybook": "start-storybook -p 6006",
    "build-storybook": "build-storybook -o dist/storybook"
  },
  "dependencies": {
    "@babel/core": "^7.20.5",
    "@babel/preset-env": "^7.20.2",
    "@babel/preset-react": "^7.18.6",
    "@emotion/react": "^11.10.5",
    "@emotion/styled": "^11.10.5",
    "@mui/icons-material": "^5.10.16",
    "@mui/material": "^5.10.16",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.5.2",
    "@types/react": "^18.0.25",
    "@types/react-dom": "^18.0.9",
    "babel-loader": "^9.1.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ],
    "overrides": [
      {
        "files": [
          "**/*.stories.*"
        ],
        "rules": {
          "import/no-anonymous-default-export": "off"
        }
      }
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "_moduleAliases": {
    "@assets": "src/assets"
  },
  "_moduleDirectories": [
    "node_modules_custom"
  ],
  "devDependencies": {
    "@mdx-js/loader": "^2.0.0-rc.2",
    "@storybook/addon-actions": "^6.5.14",
    "@storybook/addon-essentials": "^6.5.14",
    "@storybook/addon-interactions": "^6.5.14",
    "@storybook/addon-links": "^6.5.14",
    "@storybook/builder-webpack5": "^6.5.14",
    "@storybook/cli": "^6.5.14",
    "@storybook/manager-webpack5": "^6.5.14",
    "@storybook/node-logger": "^6.5.14",
    "@storybook/preset-create-react-app": "^4.1.2",
    "@storybook/react": "^6.5.14",
    "@storybook/testing-library": "^0.0.13",
    "@types/node": "^18.11.11",
    "@types/webpack": "^5.28.0",
    "babel-plugin-named-exports-order": "^0.0.2",
    "prop-types": "^15.8.1",
    "storybook-addon-material-ui": "^0.9.0-alpha.24",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.3",
    "webpack": "^5.75.0"
  }
}
```

```json:tsconfig.json
{
  "compilerOptions": {
    "target": "ES6",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
  },
  "include": [
    "src", "stories"
  ]
}
```

```js:webpack.config.js
const path = require("path");

module.exports = {
  entry: "./src/index.tsx",
  mode: process.env.NODE_ENV || "development",
  resolve: {
    modulesDirectories: [path.join(__dirname, "node_modules")],
    extensions: [".tsx", ".ts", ".js"],
  },
  devServer: {
    static: {
      directory: path.join(__dirname, "public"),
    },
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx|ts|tsx)$/,
        exclude: /node_modules/,
        use: ["babel-loader"],
      },
      {
        test: /\.mdx$/,
        exclude: /node_modules/,
        use: ["babel-loader", "@mdx-js/loader"],
      },
      {
        test: /\.(css|scss)$/,
        use: ["style-loader", "css-loader"],
      },
      {
        test: /\.(jpg|jpeg|png|gif|mp3|svg)$/,
        use: ["file-loader"],
      },
    ],
  },
};
```

```json:.babelrc
{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "ie": 11
        },
        "corejs": 3,
        "useBuiltIns": "usage"
      }
    ],
    ["@babel/preset-typescript"],
    ["@babel/preset-react"]
  ],
  "plugins": [
    "@babel/plugin-transform-shorthand-properties",
    "@babel/plugin-transform-block-scoping",
    [
      "@babel/plugin-proposal-decorators",
      {
        "legacy": true
      }
    ],
    [
      "@babel/plugin-proposal-class-properties",
      {
        "loose": true
      }
    ],
    [
      "@babel/plugin-proposal-private-methods",
      {
        "loose": true
      }
    ],
    ["@babel/plugin-proposal-private-property-in-object",
      {
        "loose": true
      }
    ],
    "@babel/plugin-proposal-export-default-from",
    "@babel/plugin-syntax-dynamic-import",
    [
      "@babel/plugin-proposal-object-rest-spread",
      {
        "loose": true,
        "useBuiltIns": true
      }
    ],
    "@babel/plugin-transform-classes",
    "@babel/plugin-transform-arrow-functions",
    "@babel/plugin-transform-parameters",
    "@babel/plugin-transform-destructuring",
    "@babel/plugin-transform-spread",
    "@babel/plugin-transform-for-of",
    "babel-plugin-macros",
    "@babel/plugin-proposal-optional-chaining",
    "@babel/plugin-proposal-nullish-coalescing-operator",
    [
      "babel-plugin-polyfill-corejs3",
      {
        "method": "usage-global",
        "absoluteImports": "core-js",
        "version": "3.18.3"
      }
    ]
  ]
}
```