loose option warning while building after 6.2.9 upgrade

Describe the bug We’re upgrading from @storybook/vue 6.1.21 to 6.2.9 an we’re now seeing the following error during Storybook start:

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.

This warning was shown multiple times during the build and then eventually I’d get an error and the build would fail.

We have a .bashrc file so I updated it to this:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": "ie 11, last 2 versions",
        "useBuiltIns": "usage",
        "corejs": 3,
        "loose": true,
        "shippedProposals": true
      }
    ]
  ],
  "env": {
    "test": {
      "presets": [
        [
          "@babel/preset-env",
          {
            "targets": {
              "node": "current"
            }
          }
        ],
        "@vue/babel-preset-jsx"
      ],
      "plugins": ["dynamic-import-node"]
    }
  },
  "plugins": [
    "@babel/plugin-syntax-dynamic-import", 
    ["@babel/plugin-proposal-class-properties", { "loose": true }],
    ["@babel/plugin-proposal-private-methods", { "loose": true }],
    ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
  ]
}

This has helped somewhat but we still get the error, however Storybook does start.

To Reproduce

All I did to see these issues was npx sb@latest upgrade and after starting storybook again I see the warnings.

System

Environment Info:

  System:
    OS: macOS 11.3
    CPU: (8) x64 Intel(R) Core(TM) i7-8559U CPU @ 2.70GHz
  Binaries:
    Node: 14.16.0 - ~/.nvm/versions/node/v14.16.0/bin/node
    Yarn: 1.15.2 - /usr/local/bin/yarn
    npm: 6.14.11 - ~/Code/snyk/registry/frontend/node_modules/.bin/npm
  Browsers:
    Chrome: 90.0.4430.93
    Firefox: 82.0.2
    Safari: 14.1
  npmPackages:
    @storybook/addon-a11y: ^6.2.9 => 6.2.9
    @storybook/addon-actions: ^6.2.9 => 6.2.9
    @storybook/addon-backgrounds: ^6.2.9 => 6.2.9
    @storybook/addon-docs: ^6.2.9 => 6.2.9
    @storybook/addon-queryparams: ^6.2.9 => 6.2.9
    @storybook/addon-storysource: ^6.2.9 => 6.2.9
    @storybook/preset-typescript: ^3.0.0 => 3.0.0
    @storybook/source-loader: ^6.2.9 => 6.2.9
    @storybook/vue: ^6.2.9 => 6.2.9

[shilman]

Jiminy cricket!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.3.0-beta.2 containing PR #15055 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb upgrade --prerelease

Closing this issue. Please re-open if you think there’s still more to do.

[kuk941025]

I tried all above workarounds, but none worked.

What worked for me was downgrading @babel/preset-env to ~7.13.0. The loose warning happened not when I upgraded storybook to 6.2.9, but when @babel/preset-env was upgraded to ^7.14.0