Невозможно заставить машинку красиво играть с бабелкой в ​​веб-пакете - PullRequest
1 голос
/ 20 февраля 2020

Я пытаюсь преобразовать проект в машинописный текст, и одно из требований состоит в том, чтобы использовать декораторы для обоих классов функций и :

function(@inject(TYPES.thing) thingy){...}

Я чувствую, что я действительно близок, просто скучаю по этой последней части головоломки:)

Вот мой конфиг веб-пакета:

return {
    entry: path.resolve(__dirname, './src/js/Index.ts'),
    output: {
        filename: 'formr.bundle.js',
        path: path.resolve(__dirname, `dist/${argv.mode === 'production' ? 'prod' : 'dev'}/js/`),
        library: 'Formr',
        libraryTarget: "umd"
    },
    devtool: devtool,
    resolve: {
        // Add '.ts' and '.tsx' as resolvable extensions.
        extensions: [".js", ".ts", ".tsx"]
    },
    mode: argv.mode,
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                loader: 'babel-loader',
                exclude: '/node_modules/',

                query: {
                    presets: [
                        "@babel/typescript",
                        ['@babel/preset-env', {
                            targets: {
                                browsers: "last 2 versions"
                            }
                        }]],
                    plugins: [
                        'lodash',
                        ["@babel/plugin-proposal-decorators", { "legacy": true }],
                        "babel-plugin-parameter-decorator",
                        '@babel/plugin-proposal-class-properties',
                        '@babel/plugin-proposal-private-methods',
                        '@babel/plugin-proposal-optional-chaining'
                    ]
                }
            },
            {
                test: /\.js$/,
                use: ["source-map-loader"],
                enforce: "pre"
            },
            {
                test: /\.svg$/,
                loader: 'svg-sprite-loader'
            }
        ],

    },
    plugins: [
        new SpriteLoaderPlugin(),
        new LodashModuleReplacementPlugin()
    ]
}

и мой tsconfig:

{
  "compilerOptions": {
    "module": "commonjs",
    "moduleResolution": "Node",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "target": "es5",
    "lib": ["es6", "dom", "es2017.object"],
    "types": ["reflect-metadata"],
    "sourceMap": true,
    "allowJs": true,
    "allowSyntheticDefaultImports": true
  },
  "exclude": [
    "node_modules"
  ],
  "include": [
    "./src/**/*"
  ]
}

Ошибка, которую я получаю во время сборки:

ERROR in ./src/js/plugins/TranslationPlugin.ts
Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: /src/js/plugins/TranslationPlugin.ts: Cannot read property 'referencePaths' of undefined
    at _loop (/node_modules/babel-plugin-parameter-decorator/lib/index.js:117:36)
    ....

Ошибка не возникает, если я удаляю плагин babel-plugin-parameter-decorator, но, конечно, я получаю ошибки о том, что не поддерживается декоратор параметров.

...