Functional example of decorators? about craco HOT 13 CLOSED

module.exports = {
    babel: {
        plugins: [
            ["@babel/plugin-proposal-decorators"]
        ]
    }
};

module.exports = {
    babel: {
        plugins: [
          ["@babel/plugin-proposal-decorators", { "decoratorsBeforeExport": true } ],
        ]
    }
};

Failed to compile.

./src/index.tsx
Error: Cannot use the decorators and decorators-legacy plugin together

warning "@babel/plugin-proposal-decorators > @babel/[email protected]" has unmet peer dependency "@babel/core@^7.0.0-0".

module.exports = {
    babel: {
        plugins: [
            ["@babel/plugin-proposal-decorators", { legacy: true }]
        ]
    }
};

const path = require("path");
const ConfigWebpackPlugin = require("config-webpack");
const { ESLINT_MODES, POSTCSS_MODES, paths } = require("@craco/craco");

const CSS_MODULE_LOCAL_IDENT_NAME = "[local]___[hash:base64:5]";

module.exports = {
    style: {
        modules: {
            localIdentName: CSS_MODULE_LOCAL_IDENT_NAME
        },
        css: {
            loaderOptions: {
                includePaths: ["/css-utils"]
            }
        },
        sass: {
            loaderOptions: {
                includePaths: ["/sass-utils"]
            }
        },
        postcss: {
            mode: POSTCSS_MODES.file
        }
    },
    eslint: {
        mode: ESLINT_MODES.file
    },
    webpack: {
        alias: {
            "@components": path.resolve(__dirname, `${paths.appSrc}/components/`)
        },
        plugins: [new ConfigWebpackPlugin()]
    },
    babel: {
        plugins: [
            "babel-plugin-jsx-control-statements",
            "babel-plugin-react-require",
            ["babel-plugin-react-css-modules", { generateScopedName: CSS_MODULE_LOCAL_IDENT_NAME, attributeNames: { "activeStyleName": "activeClassName" } }],
            ["@babel/plugin-proposal-decorators",  { legacy: true }]
        ],
    },
    jest: {
        configure: {
            globals: {
                "CONFIG": true
            },
            moduleNameMapper: {
                "^@components(.*)$": "<rootDir>/src/components$1"
            }
        }
    },
    plugins: [
        {
            plugin: {
                overrideJestConfig: ({ jestConfig }) => {
                    console.log(JSON.stringify(jestConfig, null, 4));
            
                    return jestConfig; 
                }
            }
        }
    ]
};