반응 데코레이터가 오류를 보고하면 어떻게 해야 할까요?

리액트 데코레이터 오류 해결 방법: 1. "create-react-app mobx-study"를 통해 프로젝트를 생성합니다. 2. "yarn add -D React-app-rewiredcustom-cra"를 통해 플러그인을 설치합니다. .json 파일에서 패키지 스크립트를 수정합니다. 4. 프로젝트 루트 디렉터리에 "config-overrides.js" 및 ".babelrc"를 생성합니다.

이 튜토리얼의 운영 환경: Windows 10 시스템, React 버전 18.0.0, Dell G3 컴퓨터

React 데코레이터에서 오류가 보고되면 어떻게 해야 하나요?

React의 데코레이터가 오류를 보고했습니다

1. 데코레이터가 오류를 보고했습니다@

React의 데코레이터를 처음 사용할 때 프로젝트에서 처음 사용했습니다. @
React는 기본적으로 데코레이터를 지원하지 않기 때문에 오류가 보고되므로 데코레이터를 지원하려면 일부 구성이 필요합니다.

【오류 표시: 구문 분석 오류: 이 실험적 구문에는 다음 파서 플러그인 중 하나를 활성화해야 합니다: "장식자-레거시", "장식자".】

1. 프로젝트 만들기

npm install -g create-react-app  
// 安装create-react-app，已安装请忽略
create-react-app mobx-study

2. 플러그인 설치 - create-react-app

yarn add -D react-app-rewired customize-cra 
yarn add -D @babel/core @babel/plugin-proposal-decorators @babel/preset-env

에서 webpack 구성을 변경합니다. 3. package.json 파일에서 config-overrides.js를 수정합니다. 프로젝트 루트 디렉토리에 다음 내용을 작성합니다

// package.json
"scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
  }

5. 프로젝트 루트 디렉토리에 .babelrc를 생성하고 다음 내용을 작성합니다

const path = require('path')
const { override, addDecoratorsLegacy } = require('customize-cra')

function resolve(dir) {
    return path.join(__dirname, dir)
}

const customize = () => (config, env) => {
    config.resolve.alias['@'] = resolve('src')
    if (env === 'production') {
        config.externals = {
            'react': 'React',
            'react-dom': 'ReactDOM'
        }
    }

    return config
};
module.exports = override(addDecoratorsLegacy(), customize())

기본적으로 위의 단계를 모두 마치면 데코레이터를 정상적으로 사용할 수 있으며, @에러가 발생합니다. 더 이상 보고되지 않습니다. 동시에 실험적 구문 '데코레이터-레거시'에 대한 지원이 현재 활성화되어 있지 않습니다.라는 오류도 사라집니다.

2. 수정자에 대한 실험적인 지원은 향후 버전에서 변경될 수 있습니다. 이 경고를 제거하려면 "tsconfig" 또는 "jsconfig"에서 "experimentalDecorators" 옵션을 설정하십시오. ts(1219)

설정 => ExperimentDecorators 검색 => 확인란을 선택하세요

위 내용은 반응 데코레이터가 오류를 보고하면 어떻게 해야 할까요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!