create-react-app脚手架之/packages/create-react-app核心源码解读（二）

函数checkThatNpmCanReadCwd

函数名的含义：检查 Npm 是否可以读取 Cwd

首先看下源码

const spawn = require('cross-spawn');


// See https://github.com/facebook/create-react-app/pull/3355
function checkThatNpmCanReadCwd() {
    
    
  const cwd = process.cwd();
  let childOutput = null;
  try {
    
    
    // Note: intentionally using spawn over exec since
    // the problem doesn't reproduce otherwise.
    // `npm config list` is the only reliable way I could find
    // to reproduce the wrong path. Just printing process.cwd()
    // in a Node process was not enough.
    childOutput = spawn.sync('npm', ['config', 'list']).output.join('');
  } catch (err) {
    
    
    // Something went wrong spawning node.
    // Not great, but it means we can't do this check.
    // We might fail later on, but let's continue.
    return true;
  }
  if (typeof childOutput !== 'string') {
    
    
    return true;
  }
  const lines = childOutput.split('\n');
  // `npm config list` output includes the following line:
  // "; cwd = C:\path\to\current\dir" (unquoted)
  // I couldn't find an easier way to get it.
  const prefix = '; cwd = ';
  const line = lines.find(line => line.startsWith(prefix));
  if (typeof line !== 'string') {
    
    
    // Fail gracefully. They could remove it.
    return true;
  }
  const npmCWD = line.substring(prefix.length);
  if (npmCWD === cwd) {
    
    
    return true;
  }
  console.error(
    chalk.red(
      `Could not start an npm process in the right directory.\n\n` +
        `The current directory is: ${
      
      chalk.bold(cwd)}\n` +
        `However, a newly started npm process runs in: ${
      
      chalk.bold(
          npmCWD
        )}\n\n` +
        `This is probably caused by a misconfigured system terminal shell.`
    )
  );
  if (process.platform === 'win32') {
    
    
    console.error(
      chalk.red(`On Windows, this can usually be fixed by running:\n\n`) +
        `  ${
      
      chalk.cyan(
          'reg'
        )} delete "HKCU\\Software\\Microsoft\\Command Processor" /v AutoRun /f\n` +
        `  ${
      
      chalk.cyan(
          'reg'
        )} delete "HKLM\\Software\\Microsoft\\Command Processor" /v AutoRun /f\n\n` +
        chalk.red(`Try to run the above two lines in the terminal.\n`) +
        chalk.red(
          `To learn more about this problem, read: https://blogs.msdn.microsoft.com/oldnewthing/20071121-00/?p=24433/`
        )
    );
  }
  return false;
}

函数内核心代码含义解读

childOutput = spawn.sync('npm', ['config', 'list']).output.join('');核心的一行代码的含义是什么？

1. 代码关键注解含义

// 注意：故意在 exec 上使用 spawn
// 否则问题不会重现。
// `npm config list` 是我能找到的唯一可靠的方法
// 重现错误的路径。只需打印 process.cwd()
// 在 Node 进程中是不够的

1. debug到具体执行后

如上childOutput：'; cli configs

2. 关键知识点补充

spawn依赖的第三方库const spawn = require('cross-spawn');

spawn.sync表示子进程异步执行命令

npm config list

可以直接在你的电脑控制台打印，实际上就是npm相关的一些配置，直接在控制台运行是同样的效果：

3. 继续执行

// `npm config list` 输出包括以下行：
// "; cwd = C:\path\to\current\dir" (未加引号)
// 我找不到更简单的方法来获取它。

linesdebug如下：

const prefix = '; cwd = ';
  const line = lines.find(line => line.startsWith(prefix));
  if (typeof line !== 'string') {
    
    
    // Fail gracefully. They could remove it.
    return true;
  }

'; cwd = /create-react-app/packages/my-app'
判断不成立，继续向下执行；

4. npmCWD

if (npmCWD === cwd) {
    
    
  return true;
}

成立返回true;

函数执行完成