「React 基础 」在 Windows 下使用 React , 你需要注意这些问题

关注前端达人，与你共同进步

大家好，本篇内容，我要和大家聊聊使用 Windows 开发 React ，你需要注意的一些问题。首先说明下，我不是使用 windows 进行开发，因为其配置开发环境来说不是特别方便，我更喜欢苹果mac或者乌班图这样的系统，但是使用windows 进行开发的人还是占多说的，关于这些问题还是很有必要来和大家聊聊，尤其是在我们的开发过程中，我们的项目小组开发人员，有的喜欢用 Windows ，有的喜欢用苹果mac，这就会产生一些问题。

终端（控制台）

使用 Windows 系统的同学们，你们也许经常会在系统的运行菜单里输入CMD 命令调出控制台终端，但是其存在一个问题，不支持 Unix 相关的命令，有时候就安装不了相关的依赖包。为了解决这个问题，就需要安装 Unix 终端。我强烈推荐大家使用 Git Bash 这个终端，该终端的下载地址是：https://git-scm.com；第二个选择是安装 Cygwin，是基于Linux 的终端，其安装地址是：https://www.cygwin.com。

环境变量

使用 Windows 的另一个常见问题是设置环境变量。通常，我们在mac系统下编写 npm 命令脚本时，我们设置环境变量，例如 NODE_ENV = production 或 BABEL_ENV = development，但是要在Windows中设置这些变量，前面需要加上 SET，这意味着你需要执行 SET NODE_ENV = production 或 SET BABEL_ENV = development。

这样做的问题是，如果你与使用Linux 或 Mac的人一起开发工作时，那么他们将在SET命令上遇到问题，可能你需要忽略此文件并仅针对您的本地环境对其进行修改。每次这样做可能很乏味。解决此问题的方法是使用一个名为cross-env的软件包。你可以通过执行如下命令

 npm install cross-env

进行安装，修改你的配置文件如下所示，修改后，你的项目在Windows，Mac和Linux 都是可以正常运行的：

文件名、目录名区分大小写

实际上，这在Linux上也会发生，但是有时很难想到是这个问题，例如，如果你在 components/home/Home.jsx 这个路径下创建了一个组件，然后你使用如下方式进行引入组件（请注意第一个home的第一个字母我使用了大写）：

import Home from './components/Home/Home';

通常，在Mac下开发的同学，不会遇到此类问题，但在Linux或Windows上可能会产生错误，因为系统文件路径区分大小写。

路径问题

在 Windows 下使用反斜杠（\）定义路径，而在Mac或Linux中，使用正斜杠（/）定义路径，比如我们在 Node.js 环境配置路径，如下段代码所示：

在 MAC 或 Linux 下的配置：

在 Windows 下的配置：

为了解决使用不同系统进行开发的问题，避免我们每次进行修改，我们需要导入 path 模块，就能修复此问题：

小节

今天的分享就到这里，感谢大家阅读，如果你喜欢此文章，欢迎给个赞哦，谢谢了，下一篇文章，我将带着大家一起创建我们的第一个 React 项目，敬请期待...

《 React 手册》系列文章

专注分享当下最实用的前端技术。关注前端达人，与达人一起学习进步！

长按关注"前端达人"