Vue Boilerplates : vue-typescript-bootstrapvue-boilerplate

A vue.js project with Latest Vue + Typescript + BootstrapVue + Lazy loading and code splitting

Why to choose Vue Boilerplates?

While mobile-first approach becomes a standard and uncertain network conditions are something we should always take into consideration, it’s harder and harder to keep your application loading fast. Hence Vue Boilerplates are built with vue.js performance optimization techniques that make them loading instantly and perform smooth 🚀.
Please consider becoming a donor. 🙏

Features

The following features are delivered out of the box in this repo, you are just one click away from starting your Progressive Web application (PWA) with advanced features of Vue,

• Vue
• Vue router
• Vuex
• Vue Class Component
• Typescript
• PWA - service worker
• BootstrapVue
• SASS
• babel
• Webpack bundling
• Prettier
• ESLint
• cypress
• jest
• gitignore
• VScode Workspace (optional)

Bonus

Lazy loading and Code Splitting
With dynamic imports, all pages including their dependency libraries are exported as web chunks with custom name references for lazy loading 😎
Even Vue library was exported as a seperate web chunk 😍

Getting started

# 1. Clone the repository.
git clone https://github.com/Vue-Boilerplates/vue-typescript-bootstrapvue-boilerplate.git my-new-project

# 2. Enter your newly-cloned folder.
cd my-new-project

## proceed with yarn

# 3. Install dependencies. Make sure yarn is installed: https://yarnpkg.com/lang/en/docs/install
yarn

# 4. Serve with hot reload at localhost:8080
yarn serve

# 5. Build for production with minification
yarn build

## proceed with npm

# 3. Install dependencies. Make sure npm is installed: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm
npm install

# 4. Serve with hot reload at localhost:8080
npm run serve

# 5. Build for production with minification
npm run build

## Lint - Autofixes by scans your code to find issues that can lead to bugs or inconsistencies and style

# using yarn
yarn lint

# using npm
npm run lint

Recommended VScode extensions (optional)

• Vetur
• Prettier
• ESlint
• Bracket Pair Colorizer 2
• Auto Close Tag
• Auto Rename Tag
• Code Spell Checker
• vscode-icons

Coming Soon!

• More Vue Boilerplates - Auth, Android and iOS Apps
• Detailed Documentation
• Practical Examples

Support

Give me a Star⭐️

Buy me a ☕️!

License

Released under the MIT License