Webpack Babel Loader Неожиданный элемент разбора JSX - PullRequest
Новая
       7

Webpack Babel Loader Неожиданный элемент разбора JSX

0 голосов
/ 01 февраля 2019

Я недавно обновил все мои пресеты и загрузчики babel в моей конфигурации webpack для поддержки кода из используемого мной модуля реагирования, и наряду с этим обновлением я получил ошибки, связанные с анализом JSX с ранее написанным кодом.Этот код ранее не выдавал ошибку, которая заставляет меня поверить, что это связано с обновлением и обновлением конфигурационных файлов.

Вот пример того, где генерируются ошибки:

Обратите внимание на весь коди проблемы находятся в пределах переменной class

if / else: 

if (this.props.category){
            category = <h4 className="annotation__category">{this.props.category}</h4>
        } else {
            category = null;
        }

Unexpected token (17:88)
at raise (/Users/app/Desktop/Projects/node/app/node_modules/@babel/parser/lib/index.js:3834:17)
    at unexpected (/Users/app/Desktop/Projects/node/app/node_modules/@babel/parser/lib/index.js:5142:16)
    at jsxParseElementAt (/Users/app/Desktop/Projects/node/app/node_modules/@babel/parser/lib/index.js:3499:24)

Реагируют реквизиты, завернутые в HTML-теги: 

 <p className="text-center"><b>{this.props.date}</b></p>

Unexpected token (12:79) (</b>)
at raise 
(/Users/app/Desktop/Projects/node/app/node_modules/@babel/parser/lib/index.js:3834:17)
    at unexpected (/Users/app/Desktop/Projects/node/app/node_modules/@babel/parser/lib/index.js:5142:16)
    at jsxParseElementAt (/Users/app/Desktop/Projects/node/app/node_modules/@babel/parser/lib/index.js:3499:24)

Вот мой package.json: 

"devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-proposal-class-properties": "^7.3.0",
    "@babel/preset-env": "^7.3.1",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.5",
    "css-loader": "^2.1.0",
    "style-loader": "^0.23.1",
    "webpack": "^4.29.0",
    "webpack-cli": "^3.2.1",
  }

webpack.config.js: 

module.exports = {
    mode: 'development',
    entry: "./public/index.js",
    output: {
        path: __dirname + "/dist",
        filename: "bundle.js"
    },
    module: {
        rules: [
            {   
                test: /\.js$/, 
                exclude: /node_modules/, 
                loader: "babel-loader"
            },
            {
                test: /\.css$/,
                use: ['style-loader', 'css-loader'],
            }
        ]
    },
};

.babelrc: 

{ 
    "presets": [ 
        "@babel/preset-env",
        "@babel/preset-react"
    ],
    "plugins": [
        "@babel/plugin-proposal-class-properties"
    ]
}
...