Skip to content

Commit

Permalink
chore: user won't be asked to choose Nuxt.js modules while scaffolding
Browse files Browse the repository at this point in the history
  • Loading branch information
jamesgeorge007 committed Aug 9, 2020
1 parent bca1935 commit e578ba5
Show file tree
Hide file tree
Showing 6 changed files with 30 additions and 177 deletions.
11 changes: 3 additions & 8 deletions __e2e__/commands/add.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,6 @@ describe('mevn add', () => {
['init', 'my-app'],
[
`${DOWN}${DOWN}${DOWN}${ENTER}`, // Choose Nuxt.js
`${SPACE}${ENTER}`, // Opt for @nuxtjs/axios module
ENTER, // Choose universal as the rendering mode
ENTER, // Choose server as the deploy target
`Y${ENTER}`, // Requires server directory
Expand All @@ -43,7 +42,7 @@ describe('mevn add', () => {
['add'],
[
ENTER,
`${DOWN}${SPACE}${DOWN}${DOWN}${DOWN}${SPACE}${DOWN}${DOWN}${DOWN}${DOWN}${SPACE}${ENTER}`,
`${DOWN}${SPACE}${DOWN}${DOWN}${DOWN}${DOWN}${SPACE}${DOWN}${DOWN}${DOWN}${DOWN}${SPACE}${ENTER}`,
], // Choose @nuxtjs/pwa, nuxt-oauth and @nuxtjs/storybook modules
genPath,
);
Expand All @@ -53,16 +52,15 @@ describe('mevn add', () => {
expect(nuxtConfig.buildModules).toContain('@nuxtjs/pwa');
expect(nuxtConfig.modules).toContain('nuxt-oauth');
expect(nuxtConfig.buildModules).not.toContain('@nuxtjs/storybook');
expect(nuxtConfig.modules).toContain('@nuxtjs/axios');

// .mevnrc
const projectConfig = JSON.parse(
fs.readFileSync(path.join(genPath, '.mevnrc')),
);
['pwa', 'oauth', 'storybook', 'vuex', 'axios'].forEach((module) =>
['pwa', 'oauth', 'storybook', 'vuex'].forEach((module) =>
expect(projectConfig.modules).toContain(module),
);
expect(projectConfig.isConfigured).toBe(true);
expect(projectConfig.isConfigured['client']).toBe(true);

// package.json
const pkgJson = JSON.parse(
Expand All @@ -72,9 +70,6 @@ describe('mevn add', () => {
expect(pkgJson.devDependencies['@nuxtjs/pwa']).toBeTruthy();
expect(pkgJson.devDependencies['@nuxtjs/storybook']).toBeTruthy();

// @nuxtjs/axios should be installed via mevn serve since it was opted at first
expect(pkgJson.devDependencies['@nuxtjs/axios']).not.toBeTruthy();

const gitIgnoreContent = fs
.readFileSync(path.join(clientPath, '.gitignore'), 'utf8')
.split('\n');
Expand Down
1 change: 0 additions & 1 deletion __e2e__/commands/codesplit.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,6 @@ describe('mevn codesplit', () => {
['init', 'my-app'],
[
`${DOWN}${DOWN}${DOWN}${ENTER}`, // Choose Nuxt.js
ENTER, // Nuxt.js modules aren't required
`${DOWN}${ENTER}`, // Choose spa as the rendering mode
`${DOWN}${ENTER}`, // Choose static as the deploy target
`Y${ENTER}`, // Requires server directory
Expand Down
25 changes: 6 additions & 19 deletions __e2e__/commands/init.test.js
Original file line number Diff line number Diff line change
@@ -1,12 +1,6 @@
'use strict';

import {
run,
runPromptWithAnswers,
DOWN,
ENTER,
SPACE,
} from '../../jest/helpers';
import { run, runPromptWithAnswers, DOWN, ENTER } from '../../jest/helpers';

import fs from 'fs';
import path from 'path';
Expand Down Expand Up @@ -34,7 +28,6 @@ describe('mevn init', () => {
['init', 'my-app'],
[
`${DOWN}${DOWN}${DOWN}${ENTER}`, // Choose Nuxt.js
`${DOWN}${SPACE}${DOWN}${SPACE}${ENTER}`, // Opt for @nuxtjs/content and @nuxtjs/pwa modules
`${DOWN}${ENTER}`, // Choose spa as the rendering mode
`${DOWN}${ENTER}`, // Choose static as the deploy target
`Y${ENTER}`, // Requires server directory
Expand All @@ -48,15 +41,6 @@ describe('mevn init', () => {
// nuxt.config.js
const nuxtConfig = require(path.join(clientPath, 'nuxt.config.js')).default;

// Check whether the respective entries have been updated
expect(nuxtConfig.buildModules).toContain('@nuxtjs/pwa');
expect(nuxtConfig.modules).toContain('@nuxt/content');
expect(nuxtConfig.modules).not.toContain('@nuxtjs/axios');

// Check for Nuxt.js modules config
expect(nuxtConfig).not.toHaveProperty('axios');
expect(nuxtConfig).toHaveProperty('content');

// Check for rendering mode and deploy target config
expect(nuxtConfig.mode).toBe('spa');
expect(nuxtConfig.target).toBe('static');
Expand All @@ -66,9 +50,12 @@ describe('mevn init', () => {
name: 'my-app',
renderingMode: 'spa',
template: 'Nuxt.js',
modules: ['pwa', 'content'],
modules: [],
deployTarget: 'static',
isConfigured: false,
isConfigured: {
client: false,
server: false,
},
};

const projectConfig = JSON.parse(
Expand Down
27 changes: 9 additions & 18 deletions src/commands/basic/add.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ const addDeps = async (deps, { dev }) => {
({ dir: templateDir } = await dirOfChoice());
}

const { template } = appData();
const { template, isConfigured } = appData();

// Do not proceed if the deps were not supplied
if (
Expand Down Expand Up @@ -70,11 +70,7 @@ const addDeps = async (deps, { dev }) => {
const projectConfig = appData();

// Nuxt.js modules that are already installed and configured (.mevnrc)
const {
modules: configuredModules,
isConfigured,
renderingMode,
} = projectConfig;
const { modules: configuredModules, renderingMode } = projectConfig;

// Supported Nuxt.js modules
let nuxtModules = [
Expand Down Expand Up @@ -136,7 +132,7 @@ const addDeps = async (deps, { dev }) => {
availableModules.includes(dep),
);

// Add the @nuxtjs prefix
// Add the respective prefix
const modulesWithPrefix = modules.map(
(module) =>
`${
Expand All @@ -148,7 +144,7 @@ const addDeps = async (deps, { dev }) => {
}`, // @nuxt/content has different prefix
);

// Check if there is atleast a dep to be installed
// If the user opted for atleast a Nuxt.js module
if (modules.length) {
await exec(
`npm install --save ${modulesWithPrefix.join(' ')}`,
Expand All @@ -165,7 +161,7 @@ const addDeps = async (deps, { dev }) => {
availableBuildModules.includes(dep),
);

// @nuxtjs/pwa and @nuxtjs/vuetify are supposed to be installed as a devDep
// If the user opted for atleast a Nuxt.js buildModule
if (buildModules.length) {
// Add @nuxtjs prefix
const buildModulesWithPrefix = buildModules.map(
Expand Down Expand Up @@ -488,7 +484,7 @@ const addDeps = async (deps, { dev }) => {
// Update the modules entry
projectConfig.modules = configuredModules;

if (!isConfigured) {
if (!isConfigured[templateDir]) {
// Additional dependencies were installed before invoking serve
await exec(
'npm install',
Expand All @@ -499,14 +495,9 @@ const addDeps = async (deps, { dev }) => {
},
);

// Skip configuration step involved when invoking serve
if (
['pwa', 'axios', 'content'].some((module) =>
installedNuxtModules.includes(module),
)
) {
projectConfig.isConfigured = true;
}
// Update .mevnrc
projectConfig.isConfigured[templateDir] = true;
fs.writeFileSync('.mevnrc', JSON.stringify(projectConfig, null, 2));
}

// Eslint
Expand Down
74 changes: 7 additions & 67 deletions src/commands/basic/init.js
Original file line number Diff line number Diff line change
Expand Up @@ -100,70 +100,6 @@ const fetchTemplate = async (template) => {
.toString()
.split('\n');

// Choose the Nuxt.js modules to install
const { modules } = await inquirer.prompt([
{
name: 'modules',
type: 'checkbox',
message: 'Nuxt.js modules',
choices: ['Axios', 'Progressive Web App (PWA)', 'Content'],
},
]);

// Add 2 so that the content gets inserted at the right position
const buildModulesIdx =
configFile.findIndex((line) => line.includes('buildModules:')) + 2;

const modulesIdx =
configFile.findIndex((line) => line.includes('modules:')) + 2;

projectConfig.modules = [];

// Configure @nuxtjs/axios module
if (modules.includes('Axios')) {
const axiosConfig = [
`${' '.repeat(2)}axios: {`,
`${' '.repeat(4)}// proxyHeaders: false`,
`${' '.repeat(2)}},`,
];
projectConfig.modules.push('axios');
configFile.splice(modulesIdx, 0, `${' '.repeat(4)}'@nuxtjs/axios',`);

// Add 1 so that the content gets inserted after the modules array
const modulesEndIdx =
configFile.indexOf(`${' '.repeat(2)}],`, modulesIdx) + 1;

// Add @nuxtjs/axios config beneath the modules array
axiosConfig.forEach((config, idx) =>
configFile.splice(modulesEndIdx + idx, 0, config),
);
}

// Configure @nuxtjs/pwa module
if (modules.includes('Progressive Web App (PWA)')) {
projectConfig.modules.push('pwa');
configFile.splice(buildModulesIdx, 0, `${' '.repeat(4)}'@nuxtjs/pwa',`);
}

// Configure @nuxtjs/content module
if (modules.includes('Content')) {
const contentConfig = [
`${' '.repeat(2)}content: {`,
`${' '.repeat(4)} //Options`,
`${' '.repeat(2)}},`,
];
projectConfig.modules.push('content');
configFile.splice(modulesIdx, 0, `${' '.repeat(4)}'@nuxt/content',`);

const modulesEndIdx =
configFile.indexOf(`${' '.repeat(2)}],`, modulesIdx) + 1;

// Add @nuxtjs/content config beneath the modules array
contentConfig.forEach((config, idx) =>
configFile.splice(modulesEndIdx + idx, 0, config),
);
}

// Choose the rendering mode
const { mode } = await inquirer.prompt([
{
Expand Down Expand Up @@ -198,23 +134,27 @@ const fetchTemplate = async (template) => {
}

// To be written to project specific config (.mevnrc)
projectConfig.modules = [];
projectConfig.renderingMode = mode.includes('Universal')
? 'universal'
: 'spa';
projectConfig.deployTarget = deployTarget.includes('Node.js')
? 'server'
: 'static';

// Keep track whether the Nuxt.js modules are configured
projectConfig.isConfigured = false;

// Write back the updated config file (nuxt.config.js)
fs.writeFileSync(
`./${projectPathRelative}/client/nuxt.config.js`,
configFile.join('\n'),
);
}

// Keep track whether dependencies are to be installed
projectConfig.isConfigured = {
client: false,
server: false,
};

// Update project specific config file
fs.writeFileSync(
`./${projectPathRelative}/.mevnrc`,
Expand Down
69 changes: 5 additions & 64 deletions src/commands/serve/launch.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,24 +5,6 @@ import fs from 'fs';

import exec from '../../utils/exec';

/**
* Install Nuxt.js modules
*
* @param {String[]} deps - Nuxt.js modules
* @returns {Promise<void>}
*/

const installDeps = async (deps) => {
await exec(
`npm install --save ${deps}`,
'Installing Nuxt.js modules',
`${deps} is successfully installed and configured`,
{
cwd: 'client',
},
);
};

/**
* Serve the webapp locally
*
Expand All @@ -33,15 +15,15 @@ const installDeps = async (deps) => {

const serveProject = async (projectConfig, templateDir) => {
let port;
const { template: projectTemplate } = projectConfig;
const { template: projectTemplate, isConfigured } = projectConfig;

if (templateDir === 'client') {
port = projectTemplate === 'Nuxt.js' ? '3000' : '3002';
} else {
port = projectTemplate === 'GraphQL' ? '9000/graphql' : '9000/api';
}

if (!fs.existsSync(`./${templateDir}/node_modules`)) {
if (!isConfigured[templateDir]) {
await exec(
'npm install',
'Installing dependencies in the background. Hold on...',
Expand All @@ -50,51 +32,10 @@ const serveProject = async (projectConfig, templateDir) => {
cwd: templateDir,
},
);
}

// Install Nuxt.js modules
if (templateDir === 'client' && projectTemplate === 'Nuxt.js') {
const { modules, isConfigured } = projectConfig;
if (!isConfigured) {
const installCandidate = modules.filter((module) =>
['pwa', 'axios', 'content'].includes(module),
);

// Do not proceed if the user haven't opted for any Nuxt.js modules
if (installCandidate.length) {
// Add the @nuxtjs prefix
const modulesWithPrefix = installCandidate.map(
(module) =>
`${module === 'content' ? `@nuxt/${module}` : '@nuxtjs'}/${module}`, // @nuxt/content has different prefix
);

// @nuxtjs/pwa is to be installed as a devDependency
if (installCandidate.includes('pwa')) {
await exec(
'npm install --save-dev @nuxtjs/pwa',
'Installing Nuxt.js pwa module',
'@nuxtjs/pwa is successfully installed and configured',
{
cwd: templateDir,
},
);
// User opted for additional Nuxt.js modules as well
if (installCandidate.length > 1) {
const deps = modulesWithPrefix
.filter((module) => module !== '@nuxtjs/pwa')
.join(' ');
await installDeps(deps);
}
} else {
// User hasn't opted for @nuxtjs/pwa module
await installDeps(modulesWithPrefix.join(' '));
}
}

// Update the isConfigured key
projectConfig.isConfigured = true;
fs.writeFileSync('.mevnrc', JSON.stringify(projectConfig, null, 2));
}
// Update .mevnrc
projectConfig.isConfigured[templateDir] = true;
fs.writeFileSync('.mevnrc', JSON.stringify(projectConfig, null, 2));
}

let cmd = 'serve';
Expand Down

0 comments on commit e578ba5

Please sign in to comment.