npx create-react-app每次都花费太长时间

Question

我是React的新手。每当我使用 npx create-react-app 时，时间太长即可下载所有包，例如“ react，react-dom和react-scripts” 。是每次都会发生什么事情，还是我可以做些什么，以免每次都花费太长时间？

Answer 1

因此，有两个修复方法，

修正 1：

此问题在 12.16.2-x64.msi 节点版本中出现。如果你安装了 x64 版本，那么你只需要卸载这个版本并安装 x32 位版本。或者尝试更新到最新版本。此修复程序应该可以解决您的问题。

修正 2： 如果您不想重新安装节点并继续使用当前版本，那么此修复程序将起作用。

• 打开一个新的 cmd 窗口并运行 resmon 命令。这个命令打开资源监视器，你会看到这样的 -

• 一旦您可以看到资源监视器。您需要开始寻找挂起的 cmd.exe 进程（因为根据您打开的窗口数量，会有多个 cmd.exe）。
• 如果您发现任何 cmd.exe 挂起，请恢复它。您的 cmd 进程也将恢复。可能会出现cmd再次停止的情况，您只需再次按照上述步骤操作即可。
• 有时你可能需要多次恢复 cmd.exe 如果它有悬念。并确保禁用防病毒软件，它可能会阻止创建 react npm 应用程序。

Answer 2

npx 始终使用最新版本，因此每次您要创建新应用时都会下载软件包，因此您应该检查连接，否则可以使用 npm install -g create-react-应用，但不建议这样做。 see instructions for older npm versions

Answer 3

几乎没有什么因素可能会影响npm或npx命令的性能。

1. 硬盘（大多数为5400RPM）会限制I / O性能，从而导致安装过程变慢。

2. 互联网连接问题-互联网速度慢或延迟长。

3. 所使用的终端也起着至关重要的作用。例如，众所周知，Git Bash的性能要优于Windows平台上的命令提示符。

解决方案

1. 全局安装CRA。 window.addEventListener('load', () => { canvas = document.getElementById("cnv1"); context = canvas.getContext("2d"); audioctx = new AudioContext(); WIDTH = window.innerWidth - 50; canvas.width = WIDTH - 50; HEIGHT = 500; canvas.height = 500; analyser = audioctx.createAnalyser(); analyser.fftSize = SAMPLES; oscillator = audioctx.createOscillator(); oscillator.connect(audioctx.destination); source = audioctx.createMediaElementSource(music); source.connect(analyser); source.connect(audioctx.destination); freqArr = new Uint8Array(analyser.frequencyBinCount); barHeight = HEIGHT; window.requestAnimationFrame(draw); }); function draw() { if (!music.paused) { bigBars = 0; r = 0; g = 0; b = 255; x = 0; context.clearRect(0, 0, WIDTH, HEIGHT); analyser.getByteFrequencyData(freqArr); for (var i = 0; i < INTERVAL; i++) { if (barHeight >= (240)) { bigBars++; } let num = i; barHeight = ((freqArr[num] - 128) * 3) + 2; if (barHeight <= 1) { barHeight = 2; } r = r + 10; if (r > 255) { r = 255; } g = g + 1; if (g > 255) { g = 255; } b = b - 2; if (b < 0) { b = 0; } context.fillStyle = "rgb(" + r + "," + g + "," + b + ")"; context.fillRect(x, HEIGHT - barHeight, (WIDTH / INTERVAL) - 1, barHeight); x = x + (WIDTH / INTERVAL); } } window.requestAnimationFrame(draw); } 和npm install -g create-react-app。确保定期更新软件包，以确保应用了最新的补丁程序。

2. （可选），您可以尝试操作系统级别的优化（例如磁盘碎片整理），以确保没有瓶颈。升级到SSD将产生更好的性能。

3. 您可以使用 Yarn ，根据我的经验，该I / O性能更好。与create-react-app my-app类似，Yarn具有npx。您可以执行yarn create创建一个React应用。

Answer 4

您可以对 npm 包使用本地缓存。有开源缓存，使用起来应该比较简单。安装缓存软件，并进行配置。基本上它使用磁盘空间，以换取更快的速度。如果您的机器和缓存之间的总线（网络）比您到 npm 存储库的 Internet 连接速度快，则缓存很有用。

这些缓存充当中间人，它们位于您（您想要安装包的“纱线”或“npm”）和 npm 存储库之间。缓存会检查它的磁盘上是否已经有这个包，如果有，它会比实际的 npm 存储库更快地提供它。退房例如： https://github.com/mixu/npm_lazy

Answer 5

使用以下命令全局安装 react

cy.get('a[rel="next"]').should('have.class', 'contact-next-disabled')

Answer 6

我遇到了同样的问题，并且能够像下面那样修复它。

问题： 当我为开发环境运行安装脚本时，我的组织在全局配置中设置了不同的存储库 URL。

我正在使用工作笔记本电脑做其他事情，这就是问题所在。

如何检查 运行这个命令

cat ./~npmrc

你应该看到这样的东西 注册表=https://blah blah/npm-all/

通过运行命令将其更改为默认注册表

npm config set registry https://registry.npmjs.org/

检查相同

cat ./~npmrc

现在运行命令来创建反应应用

npx create-react-app --template cra-template-rb app-name

Answer 7

1. 从命令行运行 resmon 命令
2. 查找 cmd 进程，如果 cmd 进程被挂起恢复进程，它对我有用。