Create-react-app スキャフォールディング/パッケージ/create-react-app コア ソース コードの解釈 (2)

NpmCanReadCwd の関数チェック

関数名の意味：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. デバッグ後から特定の実行まで

上記のように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" (未加引号)
// 我找不到更简单的方法来获取它。

linesデバッグは次のとおりです。

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。

関数の実行が完了しました