@anivive/create-vue3-package NPM

Package Logo

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

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:

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.