create-react-app 核心思路分析 (3)

使用 semver 包来判断某个 npm 的版本号是否符合你的要求:

const semver = require('semver'); semver.gt('1.2.3', '9.8.7'); // false semver.lt('1.2.3', '9.8.7'); // true semver.minVersion('>=1.0.0'); // '1.0.0' 9.1.3 检查 npm 包名

可以通过 validate-npm-package-name 来检查包名是否符合 npm 的命名规范。

const validateProjectName = require('validate-npm-package-name'); const validationResult = validateProjectName(appName); if (!validationResult.validForNewPackages) { console.error('npm naming restrictions'); // 输出不符合规范的 issue [ ...(validationResult.errors || []), ...(validationResult.warnings || []), ].forEach(error => { console.error(error); }); }

对应的 npm 命名规范可以见:

9.2 git 相关 9.2.1 判断本地目录是否是一个 git 仓库 const execSync = require('child_process').execSync; function isInGitRepository() { try { execSync('git rev-parse --is-inside-work-tree', { stdio: 'ignore' }); return true; } catch (e) { return false; } } 9.2.2 git init

脚手架初始化代码之后,正常的研发链路都希望能够将本地代码提交到 git 进行托管。在这之前,就需要先对本地目录进行 init:

const execSync = require('child_process').execSync; function tryGitInit() { try { execSync('git --version', { stdio: 'ignore' }); if (isInGitRepository()) { return false; } execSync('git init', { stdio: 'ignore' }); return true; } catch (e) { console.warn('Git repo not initialized', e); return false; } } 9.2.3 git commit

对本地目录执行 git commit:

function tryGitCommit(appPath) { try { execSync('git add -A', { stdio: 'ignore' }); execSync('git commit -m "Initialize project using Create React App"', { stdio: 'ignore', }); return true; } catch (e) { // We couldn't commit in already initialized git repo, // maybe the commit author config is not set. // In the future, we might supply our own committer // like Ember CLI does, but for now, let's just // remove the Git files to avoid a half-done state. console.warn('Git commit not created', e); console.warn('Removing .git directory...'); try { // unlinkSync() doesn't work on directories. fs.removeSync(path.join(appPath, '.git')); } catch (removeErr) { // Ignore. } return false; } } 10. 总结

回到 CRA,看完本文,对于 CRA 的思想可能有了个大致了解:

CRA  是一个通用的 React  脚手架,它支持自定义模板的初始化。将模板代码托管在 npm  上,而不是传统的通过 git  来托管模板代码,这样方便扩展和管理

CRA  只负责核心依赖、模板的安装和脚手架的核心功能,具体初始化代码的工作交给 react-scripts  这个包

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wsfjyy.html