使用create-react-app生成器生成的react项目,默认在根目录下是没有config目录以及config目录下的配置文件的,配置这些文件,费时费力,还特别容易出错.不过好的是,create-react-app给我们提供了一个脚本,可以帮助我们一条脚本语句,生成基本的配置文件,可以让我们继续深入我们的业务开发,而只需要对配置文件根据我们的需要进行局部的修改即可.

create-react-app生成项目后,默认的项目目录是这样的:

没有配置文件的目录,脚手架工具给我们提供的生成配置文件的命令在package.json中,如下:

在我们需要配置文件的时候,只需要运行这行脚本就可以了,

# 使用npm
npm run eject# 使用yarn
yarn run eject#使用yarn时也可以不加run
yarn eject

执行该命令后,脚本就会帮我们生成常用的配置文件,如下:

这是帮我们生成的配置文件

需要注意的时,在eject命令帮我们生成了配置文件之后,这条命令,就会在package.json中被移除(是脚本自动被移除的,不需要手动移除,也不是手动移除的).

以后我们再新建了一个新的react项目,如果发现没有配置文件,就不需要百度来百度去查找配置文件了,只需要执行一下脚本就可以了,只需要百度一下需要优化、修改的配置就可以了.

create-react-app项目添加webpack.config.js配置文件相关推荐

  1. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] 本文演示了如何将 Crea ...

  2. Vite 3.0 vs. Create React App:比较和迁移指南

    Create React App (CRA) 在 React 社区及其整个生态系统的发展中发挥了关键作用. 在突发奇想构建本地 React 开发环境时,它是不同技能的开发人员的首选工具. CRA 拥有 ...

  3. 如何使用Create React App DevOps自动化工作中所有无聊的部分

    by James Y Rauhut 詹姆士·鲁豪(James Y Rauhut) 如何使用Create React App DevOps自动化工作中所有无聊的部分 (How I automate al ...

  4. webpack配置:less/sass文件打包和分离、自动处理css前缀、消除未使用的css及完整的webpack.config.js文件...

    一.less文件打包和分离 1.要使用less,首先使用npm安装less服务:还需要安装Less-loader用来打包使用. npm install less --save-dev npm inst ...

  5. Create React App 2.0 正式发布:Babel 7、webpack 4 等

    英文原文:Create React App 2.0: Babel 7, Sass, and More – React Blog 以下是简要翻译 React 本身是没有附带任何编译工具的,如果没有测试运 ...

  6. Create React App来搭建react项目

    版本过旧请参考此网址更新:Getting Started | Create React App npx create-react-app my-app 备注:react使用比较自由,不限制多或者少,愿 ...

  7. react中webpack.config.js配置lessless-loader less

    这是我第一次配置这些,没有学过webpack,出过很错,还好后来都一一改正.我觉得我遇到的大部分问题就是版本更新了,和老师教的时候用的有一些不一样,但是我想尽量不要去直接将那些包的版本降低,最好还是使 ...

  8. 深入浅出 Create React App

    本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...

  9. webpack.config.js 参数详解

    webpack.config.js文件通常放在项目的根目录中,它本身也是一个标准的Commonjs规范的模块. var webpack = require('webpack'); module.exp ...

最新文章

  1. HDLBits 系列(19) 12小时时钟的Verilog设计
  2. poj 2482 Stars in Your Window(线段树+离散化+线扫描)
  3. 【TYVJ】1359 - 收入计划(二分)
  4. ubuntu9.10上安装jdk5
  5. Java笔记-CXF增加拦截器与自定义拦截器
  6. 【C语言】一维数组排序(函数,数组和循环结构语句)
  7. java getnextentry_java.util.zip.ZipInputStream.getNextEntry()方法示例
  8. 如何查询学校联系方式?初高等学校电话查询方法
  9. 【Python教你一招】用Python实现黑客帝国代码雨效果(3种方式)
  10. 解决springboot上传文件报错:The field XXX exceeds its maximum permitted size of 1048576 bytes
  11. 【C语言】-- 指针
  12. 关于容器和容器运行时的那些事
  13. 2022丘成桐数学竞赛放榜!清华3金10银霸榜
  14. java实现PEKS_JAVA线程基础
  15. 关于在Python当中汉字日期的转换
  16. DevOps自动化之Jenkins
  17. Bottle实例1——HelloWord
  18. aria2 php,aria2是什么东西
  19. 制作一台计算机要多少知识点,制造并运用一台超级计算机所需的技术有哪些?...
  20. Qt模仿酷狗音乐的播放图标

热门文章

  1. 20211217使用python3通过最近6期的双色球开奖结果预测新一期的号码
  2. android HttpClient 设置代理
  3. echarts python 教程_Echarts入门(零基础小白教程)
  4. Java软件开发实习生面试题总结
  5. 时间序列分析ARMA模型原理及Python statsmodels实践(上)
  6. tcl计算机语言,Vivado之TCL脚本语言基本语法介绍
  7. 电子企业WMS仓储管理系统解决方案
  8. 信鸽邮件营销专家好用吗?
  9. 冒险岛2官网模拟具体教程之一工具的准备(详解)(连载)
  10. 挂耳式运动耳机哪个品牌好?挂耳式骨传导运动耳机推荐