Skip to content

Commit 9d27500

Browse files
n3trTimer
n3tr
authored and
Timer
committed
Install react, react-dom, and react-scripts at the same time (facebook#1253)
* Install react and react-dom along with react-scripts - Install react, react-dom and react-script in a same time - Move react-scripts to devDependencies. * Check if react, react-dom has been already installed - To backward compatibility with old CRA’s cli - In case old CRA doesn’t install react, react-don along with react-scripts * Use packageName to find script dependency - use packageName to find dependency - fix pathExists.sync * Check dependencies.react in package.json instead of actual files * Process exit when dependencies not found - Show error and exit when dependencies not found. - Log install show custom package name * Remove template string * Install dependencies if template is preseted * Remove dangling comma Resolves facebook#1239
1 parent b25ed8f commit 9d27500

File tree

1 file changed

+54
-44
lines changed

1 file changed

+54
-44
lines changed

‎scripts/init.js

+54-44
Original file line numberDiff line numberDiff line change
@@ -64,8 +64,6 @@ module.exports = function(appPath, appName, verbose, originalDirectory, template
6464
}
6565
});
6666

67-
// Run yarn or npm for react and react-dom
68-
// TODO: having to do two npm/yarn installs is bad, can we avoid it?
6967
var command;
7068
var args;
7169

@@ -92,53 +90,65 @@ module.exports = function(appPath, appName, verbose, originalDirectory, template
9290
fs.unlinkSync(templateDependenciesPath);
9391
}
9492

95-
console.log('Installing react and react-dom using ' + command + '...');
96-
console.log();
93+
// Install react and react-dom for backward compatibility with old CRA cli
94+
// which doesn't install react and react-dom along with react-scripts
95+
// or template is presetend (via --internal-testing-template)
96+
if (!isReactInstalled(appPackage) || template) {
97+
console.log('Installing react and react-dom using ' + command + '...');
98+
console.log();
9799

98-
var proc = spawn(command, args, {stdio: 'inherit'});
99-
proc.on('close', function (code) {
100-
if (code !== 0) {
100+
var proc = spawn.sync(command, args, {stdio: 'inherit'});
101+
if (proc.status !== 0) {
101102
console.error('`' + command + ' ' + args.join(' ') + '` failed');
102103
return;
103104
}
105+
}
104106

105-
// Display the most elegant way to cd.
106-
// This needs to handle an undefined originalDirectory for
107-
// backward compatibility with old global-cli's.
108-
var cdpath;
109-
if (originalDirectory &&
110-
path.join(originalDirectory, appName) === appPath) {
111-
cdpath = appName;
112-
} else {
113-
cdpath = appPath;
114-
}
107+
// Display the most elegant way to cd.
108+
// This needs to handle an undefined originalDirectory for
109+
// backward compatibility with old global-cli's.
110+
var cdpath;
111+
if (originalDirectory &&
112+
path.join(originalDirectory, appName) === appPath) {
113+
cdpath = appName;
114+
} else {
115+
cdpath = appPath;
116+
}
115117

118+
console.log();
119+
console.log('Success! Created ' + appName + ' at ' + appPath);
120+
console.log('Inside that directory, you can run several commands:');
121+
console.log();
122+
console.log(chalk.cyan(' ' + command + ' start'));
123+
console.log(' Starts the development server.');
124+
console.log();
125+
console.log(chalk.cyan(' ' + command + ' run build'));
126+
console.log(' Bundles the app into static files for production.');
127+
console.log();
128+
console.log(chalk.cyan(' ' + command + ' test'));
129+
console.log(' Starts the test runner.');
130+
console.log();
131+
console.log(chalk.cyan(' ' + command + ' run eject'));
132+
console.log(' Removes this tool and copies build dependencies, configuration files');
133+
console.log(' and scripts into the app directory. If you do this, you can’t go back!');
134+
console.log();
135+
console.log('We suggest that you begin by typing:');
136+
console.log();
137+
console.log(chalk.cyan(' cd'), cdpath);
138+
console.log(' ' + chalk.cyan(command + ' start'));
139+
if (readmeExists) {
116140
console.log();
117-
console.log('Success! Created ' + appName + ' at ' + appPath);
118-
console.log('Inside that directory, you can run several commands:');
119-
console.log();
120-
console.log(chalk.cyan(' ' + command + ' start'));
121-
console.log(' Starts the development server.');
122-
console.log();
123-
console.log(chalk.cyan(' ' + command + ' run build'));
124-
console.log(' Bundles the app into static files for production.');
125-
console.log();
126-
console.log(chalk.cyan(' ' + command + ' test'));
127-
console.log(' Starts the test runner.');
128-
console.log();
129-
console.log(chalk.cyan(' ' + command + ' run eject'));
130-
console.log(' Removes this tool and copies build dependencies, configuration files');
131-
console.log(' and scripts into the app directory. If you do this, you can’t go back!');
132-
console.log();
133-
console.log('We suggest that you begin by typing:');
134-
console.log();
135-
console.log(chalk.cyan(' cd'), cdpath);
136-
console.log(' ' + chalk.cyan(command + ' start'));
137-
if (readmeExists) {
138-
console.log();
139-
console.log(chalk.yellow('You had a `README.md` file, we renamed it to `README.old.md`'));
140-
}
141-
console.log();
142-
console.log('Happy hacking!');
143-
});
141+
console.log(chalk.yellow('You had a `README.md` file, we renamed it to `README.old.md`'));
142+
}
143+
console.log();
144+
console.log('Happy hacking!');
144145
};
146+
147+
function isReactInstalled(appPackage) {
148+
var dependencies = appPackage.dependencies || {};
149+
150+
return (
151+
typeof dependencies.react !== 'undefined' &&
152+
typeof dependencies['react-dom'] !== 'undefined'
153+
)
154+
}

0 commit comments

Comments
 (0)