[리액트를 다루는기술] webpack.config.dev.js 파일이 없을 경우

https://github.com/timarney/react-app-rewired/issues/370

for react-scripts 2.1.5, webpack.config.dev.js does not exit · Issue #370 · timarney/react-app-rewired

If you are using CRA 1.x, or react-scripts-ts, you need to remain with the 1.6.2 release of react-app-rewired. To downgrade, type npm install react-app-rewired@1.6.2 or yarn add react-app-rewired@1.6.2.

There were changes in CRA 2.x that included merging the webpack.config.dev.js and webpack.config.prod.js files into a single file webpack.config.js. While react-app-rewired tries to verify which version of CRA you're using and to fallback to the separate files for older versions, that test only works properly with CRA itself - not with alternative versions of react-scripts like react-scripts-ts.

Note for below: by "customised scripts", I mean things like "react-scripts-ts".

Basic compatibility:

• If the version of react-scripts that you are using or that the customised scripts is based on is for CRA 1.x, use react-app-rewired 1.x branch (last release was 1.6.2).
• If the version of react-scripts that you are using or that the customised scripts is based on is for CRA 2.x, use the react-app-rewired 2.x branch.
• If you are using a customised version of react-scripts that was based on CRA 2.x, ask the people providing the customised version to pull in the CRA 2.1.2 change to the webpack config scripts that merged them together so that you can use the react-app-rewired branch 2.x properly.

https://github.com/velopert/learning-react/issues/51

163p webpack.config.dev.js 설정관련 CRA v2로 eject 하셨다면.. · Issue #51 · velopert/learning-react

CRA v2로 eject하신 분들이 계시다면..!

이제는 기본적으로 CSS Module을 지원하네요.

따라서 컴포넌트 스타일링 시에 CSS module을 사용하기 위해 webpack.config.dev.js 옵션을 바꿀 필요가 없어졌고, 기본에 App.css대신 App.module.css로 확장자만 변경한 후

import React, { Component } from 'react'; import styles from './App.module.css'; console.log(styles); class App extends Component { render() { return ( <div className={styles.box}> asd </div> ); } } export default App;

위와 같이 사용하면 되네요! 혹시 막히신 분들은 이거 보고 실습해보시길..^^;;

책 보면서도 너무 유익해서 계속 개선해서 더 좋은 책이 될 수 있었으면 하는 마음에 이슈 올립니다~! 벨로퍼트님 항상 감사드립니돠!