Vue Based Monorepo Template

Monorepo template for Vue.js applications and libraries
Explore the docs »

Report Bug · Request Feature

Table of Contents

1. About The Project
   • Features
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. License
4. Contact
5. Acknowledgments

About The Project

I've built this monorepo template for frontend libraries and applications based on Yarn workspaces and Nx.
The ease of code reusability as well as good starting point for optimized builds will provide you
a solid foundation for projects that are expected to grow.

Although this template is focused on the Vue.js framework, it can be easily adapted to other ones.

(back to top)

Features

The template contains a few example libraries and applications with some basic functionality.
It also demonstrates the connections between them such as usage of outsourced components and composables.

• @monorepo/app_1 - example application using shared libraries.
• @monorepo/commons - shared library with some useful helpers and Vue composables.
• @monorepo/ui - shared library with basic styling, starter components and Storybook.

(back to top)

Built With

• 
• 
• 
• 
• 
• 
• 
• 

(back to top)

Getting Started

Prerequisites

• Node.js

• yarn:

  npm install -g yarn

  Why yarn?

  Because we are using monorepo structure, we have to use so called workspaces as well.
  Yarn workspaces implementation is far superior to the npm one, by providing more features and better performance.

  For example package hoisting, which allows us installing dependencies in the root node_modules
  and save time and dependency management overhead are working much better in Yarn.
  Good explanation of the struggle with npm caveats is provided in this article ;)

Installation

1. Clone the repository

   git clone https://github.com/Nagell/monorepo_template.git

2. Install dependencies

   yarn run init

3. Start the development server

   # Start the app_1
   cd apps/app_1
   yarn run dev
   
   # Start the Storybook
   cd libs/ui
   yarn nx storybook -p 6006

All commands, tips and documentation for used tools and libraries can be found in the
DEVELOPMENT.md file.

(back to top)

License

Distributed under the MIT License. See Licence.md for details.

(back to top)

Contact

Dawid Nitka - LinkedIn

Project Link: https://github.com/Nagell/monorepo_template

(back to top)

Acknowledgments

• Best-README-Template
• @stylistic/eslint-plugin

(back to top)