create-module-app 웹 팩 구성 및 파일은 어디에 있습니까?

create-module-app 웹 팩 구성 및 파일은 어디에 있습니까?

리액트를 작성하다JS 프로젝트와create-react-app패키지와 정상적으로 동작했지만 웹 팩 파일과 설정을 찾을 수 없습니다.

react-create-app은 웹 팩에서 어떻게 작동합니까?웹 팩 컨피규레이션파일은, 디폴트 인스톨로 어디에 배치되어 있습니까.create-react-app? 프로젝트 폴더에서 구성 파일을 찾을 수 없습니다.

덮어쓰기 설정 파일은 작성하지 않았습니다.다른 문서를 사용하여 구성 설정을 관리할 수 있지만 기존 구성 파일을 찾고 싶습니다.

웹 팩 파일 및 구성을 찾으려면 패키지로 이동하십시오.json 파일을 만들고 스크립트를 찾습니다.

스크립트 객체가 라이브러리 react-scripts를 사용하고 있음을 알 수 있습니다.

node_modules로 이동하여 react-scripts 폴더 react-script-in-node-modules를 찾습니다.

이 react-scripts/scripts 및 react-scripts/config 폴더에는 모든 웹 팩 구성이 포함됩니다.

파일은 다음 위치에 있습니다.node_modules/react-scripts폴더:

웹 팩 구성:

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/config/webpack.config.js

스크립트 시작:

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/scripts/start.js

빌드 스크립트:

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/scripts/build.js

테스트 스크립트:

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/scripts/test.js

기타 등등...

CRA의 목적은 이러한 문제에 대해 걱정하지 않는 것입니다.

매뉴얼에서 다음 항목을 참조하십시오.

Web pack이나 Babel등의 툴을 인스톨 하거나 설정할 필요는 없습니다.코드에 초점을 맞출 수 있도록 미리 설정 및 숨겨져 있습니다.

컨피규레이션파일에 액세스 할 수 있도록 하려면 , 다음의 순서에 따라서 이젝트를 실시할 필요가 있습니다.

npm run eject

주의: 이것은 단방향 작업입니다.한 번 꺼내면 돌아갈 수 없어!

대부분의 시나리오에서는 이젝트를 하지 않고 다른 방법으로 동작할 수 있도록 하는 것이 좋습니다.

일부 설정 옵션을 덮어쓸 필요가 있는 경우는, https://github.com/gsoft-inc/craco 를 참조해 주세요.

많은 사람들이 웹 팩 구성 및 파일을 검색하여 자신의 구성을 추가할 목적으로 이 페이지를 방문합니다.실행하지 않고 이를 실현하는 또 다른 방법npm run ejectreact-app-rewired를 사용하는 것입니다.이를 통해 웹 팩 구성 파일을 이젝트하지 않고 덮어쓸 수 있습니다.

하면, 「」, 「이벤트하다」에됩니다./node_modules/react-scripts/config

webpack.config.dev.js. //used by `npm start`
webpack.config.prod.js //used by `npm run build`

에서 create-react-app여기: https://github.com/facebook/create-react-app/tree/master/packages/react-scripts/config

/config 폴더 안에 있습니다.

꺼낼 때 다음과 같은 메시지가 나타납니다.

 Adding /config/webpack.config.dev.js to the project
 Adding /config/webpack.config.prod.js to the project

웹 팩 설정은 react-script에 의해 처리되고 있습니다.node_modules react-scripts/config 내의 모든 webpack 설정을 찾을 수 있습니다.

또한 웹 팩 설정을 커스터마이즈하려면 이 customize-webpack-config를 수행합니다.

것은 뿐만 아니라 하는 것도 .node_modulesreact-app-rewired되지 않으며 메시지가 .

설정을 「소유」하게 되었습니다.지원은 제공되지 않습니다.주의해서 진행...

해결책 - craco를 사용합니다.

다음을 실행하여 구성 파일을 꺼냅니다.

npm run eject

그러면 프로젝트에서 생성된 구성 폴더를 찾을 수 있습니다.웹 팩 설정 파일의 init이 표시됩니다.

하고 create-react-appcraco 할 때 수 craco.config.js:

module.exports = {
    style: {
        postcssOptions: {
            plugins: [
            require('tailwindcss'),
            require('autoprefixer'),
            ],
        },
    },
    webpack: {
        configure: (webpackConfig, { env, paths }) => {
            // eslint-disable-next-line no-param-reassign
            webpackConfig.resolve.fallback = {
                fs: false,
            };
            return webpackConfig;
        },
    },
}

늦은 감이 있지만, 향후 이 문제에 직면하게 될 사람들을 위해 CRA의 웹 팩 구성에 액세스하려면 다음을 실행하는 것 외에 다른 방법이 없습니다.

$ npm run eject

단, 이젝트에서는 업데이트의 CRA 파이프라인에서 제외되므로 이젝트 시점부터 직접 유지보수를 해야 합니다.

저는 이 문제를 여러 번 겪었기 때문에 CRA와 대부분 동일한 구성을 가진 리액션 앱용 템플릿을 만들었으며, 유지보수를 쉽게 하기 위해 추가 혜택(스타일 구성 요소, 농담 단위 테스트, 배포용 Travis CI, 예쁜이, ESLint 등)도 제공했습니다.레포 좀 봐.

언급URL : https://stackoverflow.com/questions/48395804/where-is-create-react-app-webpack-config-and-files