Quasar Enterprise Monorepo Boilerplate

Monorepo Structure

Base Monorepo Structure

├── applications/                               # Full Web Applications
│   └── webapp                                  # Quasar Web Application
├── clients/                                    # Web Communication Clients
│   └── axios                                   # Axios HTTP Client Wrapper
│   └── graphql                                 # GraphQL Client Wrapper
├── packages-boilerplate-copy-and-paste/        # Boilerplate for the monorepo packages, Applications, services, adapters, components
│   └── quasar-app-extension-ui-component       # New Quasar UI Extension or App Extension
│   └── quasar-webapp                           # New Web Application With TS
│   └── service-plugin                          # New Service/Adapter/Plugin Example
│   └── vue-ts-component-plugin                 # New Vue Web Component With TS
│   └── vue-ts-component-quasar                 # New Vue Web Component With TS and Quasar
├── packages/                                   # Common Packages used on the monorepo
│   └── eslint                                  # Base eslint rules
│   └── eslint-import                           # Import-plugin eslint rules
│   └── eslint-typescript                       # Typescript eslint rules
│   └── eslint-vue                              # Vue eslint rules
│   └── eslint-vue-i18n                         # Vue-i18n eslint rulesents
│   └── quasar-testing                          # Quasar Testing Mocks and Factories
├── utils/                                      # Utils and tools for packages and applications
│   └── text-utils                              # Text Utils for Applications
│   └── vue-router-utils                        # Vue-Router-Utils for Vue-Router Vue Plugin
│   └── vuelidate-utils                         # Vuelidate Utils for Vuelidate Vue plugin
│   └── vuex-utils                              # Vuex Utils for Vuex Vue plugin
├── vuex-common-stores/                         # Common Vuex Stores used on applications and components
│   └── base-store                              # TS Decorators for Vue

Required

Global lerna installation

$ npm install -g lerna

Global yarn installation

$ npm install -g yarn

Usage

Root Commands

Use this commands on the root of the repository

# Install dependencies
$ yarn

# Link local packages together and install remaining package dependencies.
$ yarn bootstrap

# Runs commands in a scope
# $ yarn exec:in [scope] [command]
# Example
$ yarn exec:in @quasar-enterprise-monorepo/webapp serve

# Runs [majestic](https://github.com/Raathigesh/majestic) GUI
$ yarn test:unit:ui

# Runs Lint in every package.
$ yarn lint

# Runs Lint in every package and applies possibles fixes.
$ yarn lint:fix

# Check for updates on your packages.
$ yarn update:check

# WARNING THIS WILL UPDATE TO LATEST! EVEN MAJOR RELEASE!
# Check for updates on your packages and install the latest.
$ yarn update:update

# Commit your changes using [commitizen](https://github.com/commitizen/cz-cli).
$ git-cz

Releasing

# Bump version of packages changed since the last release and generate changelog.
$ yarn new-version

Lerna

# Clean the node_modules on the packages.
$ lerna clean

# Show which packages have changed.
$ lerna changed

# Show specifically what files have cause the packages to change.
$ lerna diff

# A CLI tool to help with lerna tasks
$ lerna-wizard

Local Commands

Use this commands on the folder of the packaged you are developing

# Start development
$ yarn serve

# Build the package
$ yarn build

# Run the unit tests
$ yarn test:unit

# Run the e2e tests
$ yarn test:e2e

# Open the Cypress
$ yarn test:e2e:CI

# Runs [majestic](https://github.com/Raathigesh/majestic) GUI
$ yarn test:unit:ui

# Runs Lint in every package.
$ yarn lint

# Runs Lint in every package and applies possibles fixes.
$ yarn lint:fix

Commit message format

feat(elements-table): add hat wobble
^--^ ^------------^   ^------------^
|    |                |
|    |                +-> Summary in present tense.
|    +------------------> Scope: folder name of package in kebab-case (e.g. elements-table)
|
+-----------------------> Type: chore, docs, feat, fix, refactor, style, or test.

Commit without validation

Use this command only when there are an error on Husky or Pre-Commits.

$ git commit -m "..." --no-verify

Linking

When linking inside of the Monorepo, everything works as expected. If you are trying to consume packages from this Monorepo in a different application locally, using npm link or yarn link does not work as expected. However, we have a workaround for the time being.

Run yarn build
Change the package.json of the consumer from $YOUR_PACKAGE_NAME (which lives inside the monorepo) to file:./../monorepo/packages/$YOUR_PACKAGE_NAME
Run rm -rf node_modules && yarn in the consumer
🎉

bloodf/quasar-enterprise-monorepo