cấu hình và tệp webpack tạo-Reac-app ở đâu?

Tôi tạo một dự án ReactJS với create-react-appgói và nó hoạt động tốt, nhưng tôi không thể tìm thấy các tệp và cấu hình webpack.

Làm thế nào để Reac-created-app hoạt động với webpack? Các tập tin cấu hình webpack nằm ở đâu trong một cài đặt mặc định create-react-app? Tôi không thể tìm thấy các tệp cấu hình trong các thư mục của dự án.

Tôi chưa tạo tập tin cấu hình ghi đè. Tôi có thể quản lý cài đặt cấu hình với các bài viết khác nhưng tôi muốn tìm (các) tệp cấu hình thông thường.

Nếu bạn muốn tìm tệp và cấu hình webpack, hãy truy cập tệp pack.json và tìm tập lệnh

Bạn sẽ thấy rằng các đối tượng script đang sử dụng thư viện phản ứng script

Bây giờ, hãy truy cập node_modules và tìm thư mục Reac-scripts Reac -script-in-node-module

Thư mục Reac-scripts / scripts và thư mục Reac -scripts / config chứa tất cả các cấu hình webpack.

Từ tài liệu :

Bạn không cần phải cài đặt hoặc định cấu hình các công cụ như Webpack hoặc Babel. Chúng được cấu hình sẵn và ẩn để bạn có thể tập trung vào mã.

Nếu bạn muốn có quyền truy cập vào các tệp cấu hình, bạn cần phải đẩy ra bằng cách chạy:

npm run eject

Lưu ý: đây là hoạt động một chiều. Khi bạn đẩy ra, bạn không thể quay lại!

Trong hầu hết các kịch bản, tốt nhất là không đẩy ra và cố gắng tìm cách làm cho nó hoạt động theo cách khác. Bằng cách đó, bạn có thể cập nhật các phụ thuộc của mình thông qua create-react-appvà không phải đối phó với địa ngục phụ thuộc Webpack.

Rất nhiều người đến trang này với mục tiêu tìm cấu hình và tệp webpack để thêm cấu hình của riêng họ cho họ. Một cách khác để đạt được điều này mà không cần chạy npm run ejectlà sử dụng phản ứng lại ứng dụng . Điều này cho phép bạn ghi đè lên tệp cấu hình webpack mà không cần đẩy ra.

Giả sử bạn không muốn đẩy ra và bạn chỉ muốn nhìn vào cấu hình bạn sẽ tìm thấy chúng trong /node_modules/react-scripts/config

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

Cấu hình webpack được sử dụng create-react-apptại đây: https://github.com/facebook/create-react-app/tree/master/packages/react-scripts/config

Bạn có thể tìm thấy nó trong thư mục / config .

Khi bạn đẩy bạn nhận được một tin nhắn như:

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

Cấu hình Webpack đang được xử lý bởi các kịch bản phản ứng . Bạn có thể tìm thấy tất cả cấu hình webpack bên trong node_modules Reac -scripts / config .

Và nếu bạn muốn tùy chỉnh cấu hình webpack, bạn có thể làm theo tùy chỉnh-webpack-config này

Hãy thử đẩy các tệp cấu hình, bằng cách chạy:

npm run eject

sau đó bạn sẽ tìm thấy một thư mục cấu hình được tạo trong dự án của bạn. Bạn sẽ tìm thấy tập tin cấu hình webpack của bạn init.

Tôi biết nó khá muộn, nhưng đối với những người trong tương lai vấp phải vấn đề này, nếu bạn muốn có quyền truy cập vào cấu hình webpack của CRA, không có cách nào khác ngoại trừ bạn phải chạy:

$ npm run eject

Tuy nhiên, với tính năng phóng, bạn sẽ tự loại bỏ khỏi hệ thống cập nhật CRA, do đó, từ điểm loại bỏ, bạn phải tự duy trì nó.

Tôi đã gặp vấn đề này nhiều lần và do đó tôi đã tạo một mẫu cho các ứng dụng phản ứng có hầu hết cấu hình giống như CRA, nhưng cũng có các đặc quyền bổ sung (như các thành phần theo kiểu, kiểm tra đơn vị jest, Travis ci để triển khai, đẹp hơn , ESLint, v.v ...) để bảo trì dễ dàng hơn. Kiểm tra repo .