diff --git a/packages/create-gatsby/src/index.ts b/packages/create-gatsby/src/index.ts index bc5e465f627ea..5f6b835b8cab6 100644 --- a/packages/create-gatsby/src/index.ts +++ b/packages/create-gatsby/src/index.ts @@ -3,7 +3,9 @@ import cmses from "./cmses.json" import styles from "./styles.json" import features from "./features.json" import { initStarter } from "./init-starter" +import { installPlugins } from "./install-plugins" import c from "ansi-colors" +import path from "path" const makeChoices = ( options: Record @@ -72,10 +74,14 @@ export async function run(): Promise { const messages: Array = [ `🛠 Create a new Gatsby site in the folder ${c.blueBright(data.project)}`, ] + + const plugins = [] + if (data.cms && data.cms !== `none`) { messages.push( `📚 Install and configure the plugin for ${c.red(cmses[data.cms])}` ) + plugins.push(data.cms) } if (data.styling && data.styling !== `none`) { @@ -84,12 +90,16 @@ export async function run(): Promise { styles[data.styling] )} for styling your site` ) + plugins.push(data.styling) } if (data.features?.length) { messages.push( - `🔌 Install ${data.features.map(feat => c.magenta(feat)).join(`, `)}` + `🔌 Install ${data.features + .map((feat: string) => c.magenta(feat)) + .join(`, `)}` ) + plugins.push(...data.features) } console.log(` @@ -115,9 +125,8 @@ ${c.bold(`Thanks! Here's what we'll now do:`)} `https://github.com/gatsbyjs/gatsby-starter-hello-world.git`, data.project ) - console.log( - `This is the point where we'd then install the plugins, but ${c.redBright( - `gatsby plugin add` - )} hasn't been implemented yet` - ) + + console.log(c.bold.green(`Installing plugins...`)) + + await installPlugins(plugins, path.resolve(data.project)) } diff --git a/packages/create-gatsby/src/init-starter.ts b/packages/create-gatsby/src/init-starter.ts index 7cec65712bc79..0af627891d87c 100644 --- a/packages/create-gatsby/src/init-starter.ts +++ b/packages/create-gatsby/src/init-starter.ts @@ -170,29 +170,14 @@ interface IGetPaths { selectedOtherStarter: boolean } -const successMessage = (): void => { +const successMessage = (rootPath: string): void => { reporter.info(` Your new Gatsby site has been successfully bootstrapped. Start developing it by running: + cd ${rootPath} gatsby develop `) } -export async function installPlugins( - plugins: Array, - rootPath: string -): Promise { - const command = require.resolve(`gatsby-cli/lib/create-cli`, { - paths: [rootPath], - }) - - if (!command) { - reporter.error(`Did not install Gatsby`) - return void 0 - } - const { createCli } = require(command) - return createCli([process.argv[0], command, `plugin`, `add`, ...plugins]) -} - /** * Main function that clones or copies the starter. */ @@ -204,11 +189,6 @@ export async function initStarter( await clone(starter, sitePath) - // await installPlugins( - // [`gatsby-plugin-image`, `gatsby-transformer-sharp`], - // sitePath - // ) - const sitePackageJson = await fs .readJSON(path.join(sitePath, `package.json`)) .catch(() => { @@ -226,6 +206,6 @@ export async function initStarter( false ) - successMessage() + successMessage(rootPath) // trackCli(`NEW_PROJECT_END`); } diff --git a/packages/create-gatsby/src/install-plugins.ts b/packages/create-gatsby/src/install-plugins.ts new file mode 100644 index 0000000000000..15a3244024f05 --- /dev/null +++ b/packages/create-gatsby/src/install-plugins.ts @@ -0,0 +1,27 @@ +import { reporter } from "./reporter" + +export async function installPlugins( + plugins: Array, + rootPath: string +): Promise { + let installPluginCommand + + try { + installPluginCommand = require.resolve(`gatsby-cli/lib/plugin-add`, { + paths: [rootPath], + }) + } catch (e) { + // The file is missing + } + + if (!installPluginCommand) { + reporter.error( + `Did not install Gatsby, or the version of gatsby-cli is too old` + ) + return void 0 + } + + const { addPlugins } = require(installPluginCommand) + + return addPlugins(plugins, rootPath) +}