https://github.com/ow-en/ASPCoreVueCLITemplate

ASP.NET Core 2.1 with Vue.js (vue-cli3 & webpack 4), Typescript, EF Core
https://github.com/ow-en/ASPCoreVueCLITemplate

Last synced: 5 days ago
JSON representation

ASP.NET Core 2.1 with Vue.js (vue-cli3 & webpack 4), Typescript, EF Core

• Host: GitHub
• URL: https://github.com/ow-en/ASPCoreVueCLITemplate
• Owner: ow-en
• Created: 2018-11-19T02:35:30.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2019-01-23T01:38:29.000Z (almost 6 years ago)
• Last Synced: 2024-08-02T16:56:02.300Z (3 months ago)
• Language: C#
• Size: 12.7 KB
• Stars: 51
• Watchers: 6
• Forks: 12
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Vue-cli & ASP.NET Core 2.1 with Vue.js + TypeScript and Vuetify

## To Install `dotnet new` template:

- clone repository

- within CLI, run `dotnet new -i `

- to confirm template was installed, run `dotnet new -l`

- to scaffold a new project using this template, run `dotnet new VueCLINetCoreEFCore -n  -o `

## To Install/Run Repository:

- clone repo and run `dotnet restore`

- install VUE-CLI `npm i -g @vue/cli`

- open a CLI, in any directory, and type `vue ui`

- within the vue-cli GUI, create a new project.

- within the project navigation wizard, navigate to the `VueCLICore` directory of this project (the presentation layer)

- within the `VueCLICore` directory, choose vue-cli's output directory as `ClientApp` **important: make sure "overwrite existing folder" option is checked**

- when creating the project, vue-cli GUI will allow you to use a preset, or to manually configure the project setup (and/or create a new preset). Choose manual config.

- when going through the manual configuration, select everything you want to include in the project. I recommend selecting most of the options, with Mocha for unit testing (VS compatible) and Nightwatch for e2e testing (VS & Selenium compatible)

- if you are planning on installing the Vuetify plugin after project creation, make sure that you select Stylus as the CSS preprocessor option during project setup.

- if selecting TypeScript as an option during project creation, make sure that your linting option is set to TSLint.

- create the project. when vue-cli GUI is done scaffolding the new project (inside `ClientApp`), navigate to the `ClientApp` directory and `npm install`

- At this point, you can do one of two things: add plugins (such as Vuetify) through vue-cli GUI `plugins` section, or you can run the project as-is through IIS or CLI (see below) **if adding Vuetify, I recommend allowing vue-cli to scaffold the Vuetify dependencies _before_ running the project**

- run the project through IIS in Visual Studio or through CLI using `npm run serve` (navigate to port 8080)

**Important note regarding HMR in IIS: make sure to disable SSL in the `Properties` section of the root project in Visual Studio.**