@penskemediacorp/larva 0.6.1 → 0.6.4-develop.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@penskemediacorp/larva",
-  "version": "0.6.1",
+  "version": "0.6.4-develop.16+c3d916e6",
   "description": "> TODO: description",
   "author": "laras126 <laras126@gmail.com>",
   "homepage": "https://github.com/Penske-Media-Corp/pmc-larva/tree/master/packages/larva#readme",
@@ -45,9 +45,9 @@
     "@babel/preset-env": "^7.10.4",
     "@penskemediacorp/backstopjs-config": "^0.6.0",
     "@penskemediacorp/eslint-config": "^0.6.0",
-    "@penskemediacorp/larva-css": "^0.6.0",
+    "@penskemediacorp/larva-css": "^0.6.3",
     "@penskemediacorp/larva-js": "^0.6.0",
-    "@penskemediacorp/larva-patterns": "^0.6.0",
+    "@penskemediacorp/larva-patterns": "^0.6.3",
     "@penskemediacorp/larva-scss": "^0.6.0",
     "@penskemediacorp/larva-svg": "^0.6.0",
     "@penskemediacorp/larva-tokens": "^0.6.0",
@@ -81,6 +81,7 @@
     "nodemon": "^2.0.4",
     "postcss": "^7.0.35",
     "sass": "^1.32.8",
+    "shelljs": "^0.8.5",
     "stylelint": "^13.6.1",
     "svg-sprite": "^1.5.0",
     "svgo": "^1.3.2",
@@ -88,5 +89,5 @@
     "webpack": "^4.43.0",
     "webpack-cli": "^3.3.12"
   },
-  "gitHead": "44625c6242eaea3bce6e75260f61a4b62088bf3a"
+  "gitHead": "c3d916e6a5bb62c622bb70e29d733c2807f85415"
 }

package/scripts/help.js

@@ -0,0 +1,65 @@
+/**
+ * Help command for Larva.
+ *
+ * ## OPTIONS
+ *
+ * [<command>]
+ * : Slug of a command to display the CLI usage information.
+ *
+ * ## EXAMPLES
+ *
+ *     # Display a list of available commands.
+ *     $ npx @penskemediacorp/larva help
+ *
+ *     # Display the prod command docblock.
+ *     $ npx @penskemediacorp/larva help prod
+ */
+
+// Dependencies.
+const fs = require('fs');
+const path = require( 'path' );
+const shell = require( 'shelljs' );
+
+// CLI arguments.
+const getArgsFromCli = require( '../lib/utils/getArgsFromCli' );
+const cliArgs = getArgsFromCli();
+
+const allowedCommands = [
+	'help',
+	'link-all',
+	'lint',
+	'prod',
+	'start',
+	'upgrade',
+];
+
+// Display a generic help description.
+if ( 2 !== cliArgs.length ) {
+	console.log( 'Usage: npx @penskemediacorp/larval <command> [--help]\n' );
+	console.log( `Where <command> is one of ${allowedCommands.join( ', ' )}.\n` );
+	return;
+}
+
+// Check for invalid commands.
+const command = cliArgs[1];
+if ( ! allowedCommands.includes( command ) ) {
+	console.log( `Invalid command '${command}'.\n` );
+	return;
+}
+
+// Display the docblock for a given command.
+const pathToFile = path.resolve( __dirname, `${command}.js` );
+try {
+	if ( fs.existsSync( pathToFile ) ) {
+		fs.readFile( pathToFile, 'utf8', ( error, data ) => {
+			if ( error ) {
+				console.error( error );
+				return;
+			}
+			const fileParts = data.split( '*/', 1 );
+			console.log( fileParts[0] + '*/' );
+		} );
+	}
+} catch( error ) {
+	console.error( error );
+}

package/scripts/link-all.js

@@ -0,0 +1,40 @@
+/**
+ * This command can be used from within any Larva project to link the Larva
+ * packages (from the monorepo) for local development.
+ *
+ * @see https://github.com/penske-media-corp/pmc-larva/blob/master/README.md#linking-larva-for-local-development
+ *
+ * ## OPTIONS
+ *
+ * [--help]
+ * : Display usage and examples for this command.
+ *
+ * ## EXAMPLES
+ *
+ *     # NPM link local packages to Larva monorepo.
+ *     $ npx @penskemediacorp/larva link-all
+ *
+ *     # Help command.
+ *     $ npx @penskemediacorp/larva link-all help
+ */
+
+const shell = require( 'shelljs' );
+
+// CLI arguments.
+const getArgsFromCli = require( '../lib/utils/getArgsFromCli' );
+const cliArgs = getArgsFromCli();
+
+// Handle help command.
+if ( cliArgs.includes( '--help' ) ) {
+    shell.exec( `npx @penskemediacorp/larva help link-all` );
+    return;
+}
+
+shell.exec( 'npm link @penskemediacorp/larva' );
+shell.exec( 'npm link @penskemediacorp/larva-css' );
+shell.exec( 'npm link @penskemediacorp/larva-js' );
+shell.exec( 'npm link @penskemediacorp/larva-patterns' );
+shell.exec( 'npm link @penskemediacorp/larva-scss' );
+shell.exec( 'npm link @penskemediacorp/larva-svg' );
+shell.exec( 'npm link @penskemediacorp/larva-tokens' );
+shell.exec( 'npm link @penskemediacorp/twig-to-php-parser' );

package/scripts/lint.js

@@ -0,0 +1,73 @@
+/**
+ * Lint JavaScript and CSS files in a Larva project.
+ *
+ * ## OPTIONS
+ *
+ * [--help]
+ * : Display usage and examples for this command.
+ *
+ * [--css]
+ * : Lint CSS assets.
+ *
+ * [--js]
+ * : Lint JavaScript assets.
+ *
+ * [--fix]
+ * : Try to automatically fix any issues that arise while linting.
+ *
+ * ## EXAMPLES
+ *
+ *     # Lint CSS and JavaScript assets.
+ *     $ npx @penskemediacorp/larva lint
+ *
+ *     # Only lint CSS assets.
+ *     $ npx @penskemediacorp/larva lint --css
+ *
+ *     # Only lint JavaScripot assets.
+ *     $ npx @penskemediacorp/larva lint --js
+ *
+ *     # Fix CSS and JavaScript assets.
+ *     $ npx @penskemediacorp/larva lint --fix
+ *
+ *     # Mix and match, fix JavaScript assets.
+ *     $ npx @penskemediacorp/larva lint --js --fix
+ *
+ *     # Help command.
+ *     $ npx @penskemediacorp/larva lint --help
+ */
+
+// Dependencies.
+const path = require( 'path' );
+const shell = require( 'shelljs' );
+
+// Construct some paths to point our scripts at.
+const binPath = path.resolve( __dirname, '../bin/larva.js' ); // For sibling scripts.
+const workingDirectory = process.cwd(); // For paths relative to the directory this script was called from.
+
+// CLI arguments.
+const getArgsFromCli = require( '../lib/utils/getArgsFromCli' );
+const cliArgs = getArgsFromCli();
+
+// Handle help command.
+if ( cliArgs.includes( '--help' ) ) {
+    shell.exec( `npx @penskemediacorp/larva help lint` );
+    return;
+}
+
+// Trigger linting when a specific flag is present, or when neither flag is
+// present.
+const lintCSS = cliArgs.includes( '--css' ) || ! cliArgs.includes( '--js' );
+const lintJS = cliArgs.includes( '--js' ) || ! cliArgs.includes( '--css' );
+
+// Appends ` fix` to our linting scripts if the flag is present.
+const fix = cliArgs.includes( '--fix' ) ? ' fix' : '';
+
+if ( lintCSS ) {
+	console.log( 'Linting CSS assets\n\n\n' );
+	shell.exec( `${binPath} lint-scss${fix}` );
+}
+
+if ( lintJS ) {
+	console.log( 'Linting JavaScript assets\n\n\n' );
+	shell.exec( `${binPath} lint-js ${workingDirectory}${fix}` );
+}

package/scripts/prod.js

@@ -0,0 +1,122 @@
+/**
+ * Run a production ready build in a Larva project.
+ *
+ * ## OPTIONS
+ *
+ * [--help]
+ * : Display usage and examples for this command.
+ *
+ * [--parse]
+ * : Run the Twig-to-PHP parser.
+ *
+ * [--parser]
+ * : Alias for --parse.
+ *
+ * [--json]
+ * : Run the write-json script.
+ *
+ * [--write-json]
+ * : Alias for --json.
+ *
+ * [--css]
+ * : Build CSS assets.
+ *
+ * [--scss]
+ * : Alias for --css.
+ *
+ * [--js]
+ * : Build JavaScript assets.
+ *
+ * [--svg]
+ * : Build SVG assets.
+ *
+ * ## EXAMPLES
+ *
+ *     # Run a full build
+ *     $ npx @penskemediacorp/larva prod
+ *
+ *     # Only run the write-json script.
+ *     $ npx @penskemediacorp/larva prod --write-json
+ *
+ *     # Run builds for CSS & JavaScript.
+ *     $ npx @penskemediacorp/larva prod --css --js
+ *
+ *     # Help command.
+ *     $ npx @penskemediacorp/larva prod --help
+ */
+
+// Dependencies.
+const path = require( 'path' );
+const shell = require( 'shelljs' );
+
+// Construct some paths to point our scripts at.
+const binPath = path.resolve( __dirname, '../bin/larva.js' ); // For sibling scripts.
+
+// CLI arguments.
+const getArgsFromCli = require( '../lib/utils/getArgsFromCli' );
+const cliArgs = getArgsFromCli();
+
+// Handle help command.
+if ( cliArgs.includes( '--help' ) ) {
+	shell.exec( `npx @penskemediacorp/larva help prod` );
+	return;
+}
+
+// Run the Twig-to-PHP parser.
+if (
+	1 === cliArgs.length
+	|| cliArgs.includes( '--parser' )
+	|| cliArgs.includes( '--parse' )
+) {
+	console.log( 'Parsing Twig templates\n\n' );
+	shell.exec( `npx @penskemediacorp/twig-to-php-parser` );
+} else {
+	console.log( 'Skipping Twig templates\n' );
+}
+
+// Run the write-json script.
+if (
+	1 === cliArgs.length
+	|| cliArgs.includes( '--json' )
+	|| cliArgs.includes( '--write-json' )
+) {
+	console.log( 'Building JSON assets\n\n' );
+	shell.exec( `${binPath} write-json` );
+} else {
+	console.log( 'Skipping write-json\n' );
+}
+
+// Build CSS/SCSS.
+if (
+	1 === cliArgs.length
+	|| cliArgs.includes( '--css' )
+	|| cliArgs.includes( '--scss' )
+) {
+	console.log( 'Building CSS assets\n\n' );
+	shell.exec( `${binPath} prod-scss` );
+} else {
+	console.log( 'Skipping building CSS\n' );
+}
+
+// Build JS.
+if (
+	1 === cliArgs.length
+	|| cliArgs.includes( '--js' )
+) {
+	console.log( 'Building JavaScript assets\n\n' );
+	shell.exec( `${binPath} prod-js` );
+} else {
+	console.log( 'Skipping building JavaScript\n' );
+}
+
+// Build SVG.
+if (
+	1 === cliArgs.length
+	|| cliArgs.includes( '--svg' )
+) {
+	console.log( 'Building SVG assets\n\n' );
+	shell.exec( `${binPath} build-icons` );
+	shell.exec( "npx svgo -f src/svg -o build/svg" );
+} else {
+	console.log( 'Skipping building the SVGs\n' );
+}

package/scripts/start.js

@@ -0,0 +1,36 @@
+/**
+ * Start the Larva server.
+ *
+ * ## OPTIONS
+ *
+ * [--help]
+ * : Display usage and examples for this command.
+ *
+ * ## EXAMPLES
+ *
+ *     # Start server.
+ *     $ npx @penskemediacorp/larva start
+ *
+ *     # Help command.
+ *     $ npx @penskemediacorp/larva start --help
+ */
+
+// Dependencies.
+const path = require( 'path' );
+const shell = require( 'shelljs' );
+
+// CLI arguments.
+const getArgsFromCli = require( '../lib/utils/getArgsFromCli' );
+const cliArgs = getArgsFromCli();
+
+// Handle help command.
+if ( cliArgs.includes( '--help' ) ) {
+    shell.exec( `npx @penskemediacorp/larva help start` );
+    return;
+}
+
+// Construct some paths to point our scripts at.
+const binPath = path.resolve( __dirname, '../bin/larva.js' ); // For sibling scripts.
+const patternsPath = path.resolve( process.cwd(), './src/patterns' ); // Relative path to the patterns.
+
+shell.exec( `${binPath} server --watch ${patternsPath} -e twig,html,js` );

package/scripts/upgrade.js

@@ -0,0 +1,99 @@
+/**
+ * Lint JavaScript and CSS files in a Larva project.
+ *
+ * ## OPTIONS
+ *
+ * [--help]
+ * : Display usage and examples for this command.
+ *
+ * [--version]
+ * : Optional. Version of Larva to install. Defaults to 'latest'.
+ *
+ * [--skip-css]
+ * : Skip building CSS assets.
+ *
+ * [--skip-js]
+ * : Skip building JavaScript assets.
+ *
+ * [--skip-build]
+ * : Skip building any assets.
+ *
+ * ## EXAMPLES
+ *
+ *     # Upgrade to latest and kickoff a build.
+ *     $ npx @penskemediacorp/larva upgrade
+ *
+ *     # Skip building CSS assets.
+ *     $ npx @penskemediacorp/larva upgrade --skip-css
+ *
+ *     # Skip both CSS and JavaScript assets.
+ *     $ npx @penskemediacorp/larva upgrade --skip-css --skip-js
+ *
+ *     # Skip the entire build.
+ *     $ npx @penskemediacorp/larva upgrade --skip-build
+ *
+ *     # Upgrade to a specific version
+ *     $ npx @penskemediacorp/larva upgrade --version=0.6.0
+ *
+ *     # Help command.
+ *     $ npx @penskemediacorp/larva upgrade --help
+ */
+// Dependencies.
+const path = require( 'path' );
+const shell = require( 'shelljs' );
+
+// Construct some paths to point our scripts at.
+const binPath = path.resolve( __dirname, '../bin/larva.js' ); // For sibling scripts.
+
+// CLI arguments.
+const getArgsFromCli = require( '../lib/utils/getArgsFromCli' );
+const cliArgs = getArgsFromCli();
+
+// Handle help command.
+if ( cliArgs.includes( '--help' ) ) {
+	shell.exec( `npx @penskemediacorp/larva help upgrade` );
+	return;
+}
+
+// Parse the --version flag. Defaults to 'latest'.
+const getVersionArg = () => {
+
+    // Loop through our args, looking for `--version=`.
+	const versionFlag = cliArgs.find( ( cliArg ) => {
+		if ( ! cliArg.includes( '--version=' ) ) {
+			return false;
+		}
+		return true;
+	} );
+
+    // Did not find it.
+	if ( ! versionFlag ) {
+		return 'latest';
+	}
+
+    // Trip the value down to just the version.
+	const version = versionFlag.replace( '--version=', '' );
+	return version ? version : 'latest';
+};
+
+// Update Larva version installed.
+console.log( `Installing Larva@${getVersionArg()}\n\n` );
+shell.exec( `npm install @penskemediacorp/larva@${getVersionArg()}` );
+
+// Build CSS.
+if (
+	! cliArgs.includes( '--skip-css' )
+	|| cliArgs.includes( '--skip-build' )
+) {
+	console.log( 'Building CSS assets\n\n' );
+	shell.exec( `${binPath} prod-scss` );
+}
+
+// Build JavaScript.
+if (
+	! cliArgs.includes( '--skip-js' )
+	|| cliArgs.includes( '--skip-build' )
+) {
+	console.log( 'Building JavaScript assets\n\n' );
+	shell.exec( `${binPath} prod-js` );
+}