Giter Club home page Giter Club logo

aspcorevueclitemplate's Introduction

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 <path to repository folder where .template.config is located>
  • to confirm template was installed, run dotnet new -l
  • to scaffold a new project using this template, run dotnet new VueCLINetCoreEFCore -n <nameofproject> -o <nameofproject>

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.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.