Vue 3 Package Starter

Vue Starter Package integrated with Typescript and Eslint

Automated unit testing with Jest

Auto-generated documentation via Docsify

Getting Started

Install necessary dependencies:

npm install

Create new project

npx create-vue3-package <repo-name>

Initiate test suite

npm test

Serve docs

npm run docs

visit -> http://localhost:3000

Table of Contents

• Overview
• Getting Started
• Table of Contents
• What's in this Package?
• Testing
• Documentation
• How to Open Source Your Project
• Contributing Guidelines
• Code Of Conduct
• Bugs and Feature Requests
• Copyright and License

What's in this Package?

create-vue3-package
├── templates
│   └── ISSUE_TEMPLATE
│       └── bug_report.md
│       └── feature_request.md
│   └── CODE_OF_CONDUCT.md
│   └── CONTRIBUTING.md
│   └── LICENSE.md
│   └── PULL_REQUEST_TEMPLATE.md
│   └── README_TEMPLATE.md
│   └── src
│       └── main.ts
│       └── main.vue
│   └── tests
│       └── example-ts-file.test.js
│       └── example-vue-file.test.js
│   └── docs
│       └── customization
│           └── configuration.md
│           └── themes.md
│       └── getting_started
│           └── more-pages.md
│           └── quickstart.md
│       └── guides
│           └── deploy.md
│           └── helpers.md
│       └── .nojekyll
│       └── _sidebar.md
│       └── changelog.md
│       └── index.html
│       └── README.md

Testing

To expand on the test suite, add your test files to the /tests directory, and Jest will automatically pick them up.

This package has been pre-configured to test .js, .ts, and .vue files for your convenience. Please see /templates/tests for example implementation.

To run your automated tests, run the commands below in your terminal:

cd <repo-name>

npm test

If you would like to have an HTML file generated to view the results in more detail, please uncomment the line 'html' in jest.config.js. Otherwise, the results will be visible in your terminal.

Jest Documentation

Documentation

This package is set up to use Docsify, a documentation generator that creates a website portal for you and your team to view all of your documentation automatically.

Your documentation README files are located in the /docs directory.

/docs/README.md                 ==> landing page for your documentation portal
/docs/_sidebar.md               ==> displays your documentation archictecture
/docs/changelog.md              ==> references your documentation updates
/docs/customization/            ==> example folder
/docs/getting_started/          ==> example folder
/docs/guides/                   ==> example folder

In order to view your documentation, run the commands below in your terminal:

npm i docsify-cli -g

cd <repo-name>

npm run docs

View your documentation at: http://localhost:3000

Docsify Documentation

How to Open Source Your Project

If you are looking to open source this project, we've created some template documentation for you to get the ball rolling:

• MIT License
• Contributing Guidelines
• Code of Conduct
• Pull Request Template
• Bug Report Template
• Feature Request Template

For more information on creating an open source project and best practices, here are some helpful resources to get you started:

• Open Source Guides
• Github Learning Lab - Create an open source program

Contributing Guidelines

Please read through our contributing guidelines. Included are directions for opening issues, coding standards, and notes on development.

Moreover, if your pull request contains JavaScript patches or features, you must include relevant unit tests. All HTML and CSS should conform to the Code Guide, maintained by Mark Otto.

Code of Conduct

Please read through our code of conduct.

Bugs and Feature Requests

Found a bug or have a feature request? Please first read the issue guidelines and search for existing and closed issues.

If your problem or idea is not addressed yet, please open a new issue.

Copyright and License

Code and documentation copyright 2021 Anivive Lifesciences Code released under the MIT License.

Docs released under Creative Commons.

Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by its terms.

Status badges created using Shields.io.