vanilla-js

This is a generator for creating Genesis themed typescript application templates. Developers have full freedom to use any JS , CSS library/framework and customize the application as per their need.

Usage

Prerequisites

For Using this package into your app, to create vanilla typescript apps, please follow the below steps

• Install the create workspace package - yarn add @genesisx/create-workspace
• Run npx @genesisx/create-workspace in a blank directory
• Provide the requested parameters:
  • Provide a name to your workspace like test-workspace
• Move to the created workspace - cd test-workspace
• Install the packages - yarn install
• Install vanilla-js package - yarn add @genesisx/vanilla-js
• Now follow the either of the two modes to use this generator - either the CLI or NX console

Usage Via NX Console

• Select NX Console > generate > search for @genesisx/vanilla-js - templated
• Provide the requested parameters:
  • appName: name of the application
  • port: port on which application needs to be run
  • docs: docs (url) of the application
  • style: file extension to be used for style files
• Click on Run
• To serve the generated app - select serve from the NX Console > choose the app to be served > select the appropriate options > Run
• To build the generated app - select build from the NX Console > choose the app to be built > select the appropriate options > Run
• To run lint on the generated app - select lint from the NX Console > choose the app to execute linting > select the appropriate options > Run
• To run unit tests on the generated app - select test from the NX Console > choose the app to be tested > select the appropriate options > Run

Usage Via Command line

• If NX Console doesnt work, alternatively use this command - nx generate @genesisx/vanilla-js:templated <appName> --no-interactive
• or run the command - nx generate @genesisx/vanilla-js:templated and supply the arguments as per the prompts
• If nx is not already installed, then install it using npm install -g nx
• To serve the app - nx serve <appName>
• To build the app - nx build <appName>
• To execute the lint checks on the app - nx lint <appName>
• To execute the unit tests - nx test <appName>

Contribution

Running build and lints

Run nx lint vanilla-js to execute the lint checks on this package.

Run nx build vanilla-js to build this package.

Run nx test vanilla-js to execute the unit tests via Jest.

Publish to NPM

To publish the package you must first be logged into NPM (npm login) then run this command from the root of the project.

• Make sure the package name in package.json should start with @genesisx/
• Also use the correct version number in package.json same will be used for the published package.
• Use your NPM js credentials (Publicis Sapient) with publish rights
• Verify the package at https://www.npmjs.com/settings/genesisx/packages

npm publish dist/packages/vanilla-js --access public

Local development and testing

If you're going to locally develop and run/test this package you need to build it and copy into node_modules with every change. You can simply do this by running a bash command below:

yarn nx run vanilla-js:build && cp -R dist/packages/vanilla-js/ node_modules/@genesisx/vanilla-js/