이전 React 버전에서 create-react-app을 사용하는 방법

이전 React 버전에서 create-react-app을 사용하는 방법

create-react-app을 custom-react-scripts와 함께 사용하면 항상 React 16(최신)이 설치됩니다.React 15와 같이 이전 버전으로 새 프로젝트를 만드는 방법이 있습니까?

리액션 v18 때문에 여기 오신 경우 이전 버전 변경 없이 이전 버전으로 이동하려면 다음과 같이 하십시오.

당신의 안에서package.json대체:

"react": "^18.0.0"
"react-dom": "^18.0.0"

와 함께

"react": "^17.0.2"
"react-dom": "^17.0.2"

그런 다음 엔트리 파일로 이동합니다.index.js맨 위에서 다음을 교체합니다.

import ReactDOM from 'react-dom/client'

와 함께

import ReactDOM from 'react-dom';

아직 네 안에index.js파일, 치환:

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

와 함께

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

• 삭제하다node_modules실행하다yarn install또는npm install
• 설치 후 실행yarn start또는npm run start
• 즐거운 시간 되세요.

React 16 앱을 생성하고 패키지를 편집하는 데 사용할 수 있을 것 같습니다.json and runnpm i(또는npm install;npm i지름길일 뿐입니다.)

지금 막 떠났어요react-scripts최신 버전 및 버전만 변경했습니다.react그리고.react-dom, 효과가 있었습니다.

"devDependencies": {
  "react-scripts": "1.0.14"
},
"dependencies": {
  "react": "^15.6.1",
  "react-dom": "^15.6.1"
},

위에서 설명한 답변을 보완하기 위해 모든 조작 후에 다음 libs(TS 템플릿용)를 업데이트해야 했습니다.

"@testing-library/react": "^12.1.1",
"@testing-library/user-event": "^12.5.0"

이미 작성한 경우React 18버전 18을 이전 버전의 반응으로 다운그레이드 할 수 있습니다.다음의 2개의 파일에 변경을 가할 필요가 있습니다.package.json그리고.index.js. 삭제해야 합니다.node_modules

순서 1

당신의.index.js아마 지금 이렇게 생겼을 거야

import React from "react";
import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";

const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

Import를 변경해야 합니다.ReactDOM및 취소const root선

의 새로운 코드index.js이래야 한다

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

순서 2

으로 이동합니다.package.json종속성으로 원하는 리액트 버전 파일 및 업데이트

"dependencies": {
    ...
    "react": "^17.0.0",
    "react-dom": "^17.0.0",
    ...
  },

순서 3

node_modules를 삭제하고 npm을 사용하는 경우 다음 작업을 수행합니다.npm i실을 사용한다면, 하세요.yarn install이 단계를 마치면 앱을 실행할 수 있습니다.npm start또는yarn start.

스텝 4 (옵션: 아직 문제가 있지만 권장하지 않습니다)

삭제하다package-lock.json(npm의 경우) 또는yarn.lock줄서기(실용)를 하고 스텝3부터 다시 시작합니다.

• 사용할 때

npx create-react-app app-name

항상 최신 리액트 패키지를 설치합니다.그럼, 인react 18.2.0이전 버전에 대한 차이점 중 일부입니다.

• 현재 리액트 버전을 이전 리액트 버전으로 다운그레이드하려면 Try These 5 Steps를 참조하십시오.

1. 폴더 파일 구조로 이동하여 둘 다 삭제합니다.package-lock.json(yarn.lock실) 파일 및node_modules파일.

2. 그 다음에package.json파일화하여 다음 의존관계를 변경 및 편집합니다.

"react": "^18.2.0",
"react-dom": "^18.2.0",

로.

"react": "^17.0.2",
"react-dom": "^17.0.2",

당신의 안에서package.json 의존관계 파일은 다음과 같습니다.

3. 사용자로 이동한 후index.js파일 변경,

import ReactDOM from 'react-dom/client'

로.

import ReactDOM from 'react-dom';

4. 변경 후index.js인덱스 파일의 일부 아래에 파일을 저장하고 변경합니다.

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

로.

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

5. 그리고 마지막으로 '열면 된다', '', '열면 된다' 이렇게 .terminal

npm 을 사용하는 --> npm 을 합니다.npm install

할 수 .npm start.

또는

--> > > > > 실 if if if if> -->yarn install

할 수 .yarn start.

--감사합니다------해피 코딩--

create-contract-app v18 v이 v 。가 한 은 제가 입니다.package-lock.json 'my 'the my 'the's my 'the's name'node_modules편집하다. 편집했습니다.package.json후 을 대체하고 내가 합니다.

"react": "^17.0.2",
"react-dom": "^17.0.2",

했습니다.npm install

1. 먼저 react app npx create-react-app을 만듭니다. (. 현재 파일을 의미합니다.)

2. node_modules & package-lock.json 삭제

 "@material-ui/core": "^4.12.2",
    "@material-ui/icons": "^4.11.2",
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^11.2.7",
    "@testing-library/user-event": "^12.8.3",
    "firebase": "^8.8.0",
    "firebase-login": "^1.0.0",
    "firebase-tools": "^9.16.0",
    "react": "^17.0.2",
    "react-currency-format": "^1.0.0",
    "react-dom": "^17.0.2",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.3",
    "web-vitals": "^1.1.2"

필요한 리액트 및 리액트돔 버전과 기타 필요한 버전

4. bash/terminal npm 설치에서 명령어 실행

(package.json에 따라 모든 데이터가 다운로드 됩니다.)

5. (옵션) 프로젝트 src/index.js에서

ReactDOM.render(`enter code here`
  <React.StrictMode>
  <App />
  </React.StrictMode>,
  document.getE1ementById( 'root' )
);
 
Replace this with 
 
 
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

이것.

먼저 시스템에 npm을 설치해야 합니다.그 후 Create React 앱을 실행하려면 다음 명령을 실행해야 합니다.

sudo npm init react-app my-app --sudo-version 1.1.5

cd my-app

sudo npm install --save react@16.0.0

sudo npm install --save react-dom@16.0.0

그것은 내게는 마법처럼 작용했다.

나한테는 효과가 있었어

1. 리액트 18을 제거하고 리액트 17을 설치합니다.

이 명령어 실행

npm uninstall react 

2. 그런 다음 React 17.0.2 이 명령을 실행합니다.

npm install react@17.0.2

3. react-dom 버전17.0.2 를 인스톨 하려면 , 다음의 커맨드를 실행합니다.

   npm install --save react-dom@17.0.2

• 편리한 경우 즐기거나 의견을 추가하세요.

프로젝트 생성 중 스크립트 버전 지정

sudo npm init react-app appname --sudo-version 1.0.13

그것은 나에게 효과가 있다.

언급URL : https://stackoverflow.com/questions/46566830/how-to-use-create-react-app-with-an-older-react-version