[Storybook 6] The "zero-config" TypeScript config doesn't work on our project

Describe the bug
A clear and concise description of what the bug is.

Build error for 2 syntaxes:

1. const enum
2. declare class fields

ERROR in ./src/plugins/FileService/constants.ts
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /home/jack/workspace/maskbook/src/plugins/FileService/constants.ts: 'const' enums are not supported.
   9 | export const signing = 'https://service.maskbook.com/arweave-remote-signing'
  10 | 
> 11 | export const enum FileRouter {
     |        ^
  12 |     upload = '/upload',
  13 |     uploading = '/uploading',
  14 |     uploaded = '/uploaded',

ERROR in ./src/utils/ObservableMapSet.ts
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /home/jack/workspace/maskbook/src/utils/ObservableMapSet.ts: TypeScript 'declare' fields must first be transformed by @babel/plugin-transform-typescript.
If you have already enabled that plugin (or '@babel/preset-typescript'), make sure that it runs before any plugin related to additional class features:
 - @babel/plugin-proposal-class-properties
 - @babel/plugin-proposal-private-methods
 - @babel/plugin-proposal-decorators
  2 | // Consider switch to libraries like Mobx if this file become too complex.
  3 | export class ObservableWeakMap<K extends object, V> extends WeakMap<K, V> {
> 4 |     declare __brand: 'Map'
    |     ^^^^^^^^^^^^^^^^^^^^^^
  5 | 
  6 |     event = new Emitter<{ delete: [K]; set: [K, V] }>()
  7 |     delete(key: K) {

To Reproduce

Reproduction: https://github.com/DimensionDev/Maskbook/pull/1568

Expected behavior Build successfully

System:
Please paste the results of npx sb@next info here.

Environment Info:

  System:
    OS: Linux 5.8 Arch Linux
  Binaries:
    Node: 14.10.0 - /usr/bin/node
    Yarn: 1.22.5 - /usr/bin/yarn
    npm: 6.14.7 - /usr/bin/npm
  npmPackages:
    @storybook/addon-actions: ^6.0.21 => 6.0.21
    @storybook/addon-docs: ^6.0.21 => 6.0.21
    @storybook/addon-info: ^5.3.21 => 5.3.21
    @storybook/addon-knobs: ^6.0.21 => 6.0.21
    @storybook/addon-links: ^6.0.21 => 6.0.21
    @storybook/addon-viewport: ^6.0.21 => 6.0.21
    @storybook/addons: ^6.0.21 => 6.0.21
    @storybook/react: ^6.0.21 => 6.0.21

Additional context
Add any other context about the problem here.

[shilman]

If you want this fixed, please upvote by adding a 👍 to the issue description. We use this to help prioritize!

[spjtls9]

Similar to other solutions, but this one worked for my project

in main.js

module.exports = {
    stories: ["../**/*.stories.(ts|tsx)"],
    addons: ["@storybook/addon-links", "@storybook/addon-essentials", "@storybook/addon-a11y"],
    webpackFinal: async (config, { configType }) => {
        // `configType` has a value of 'DEVELOPMENT' or 'PRODUCTION'
        // You can change the configuration based on that.
        // 'PRODUCTION' is used when building the static version of storybook.

        // Return the altered config
        return config;
    },
    babel: async ({ plugins, ...rest }) => ({
        ...rest,
        // any extra options you want to set
        plugins: ["const-enum", ...plugins],
    }),
};

Babel config is the part that is modified

    babel: async ({ plugins, ...rest }) => ({
        ...rest,
        // any extra options you want to set
        plugins: ["const-enum", ...plugins],
    }),