.NET MVC, Webpack and Vue.js — Part 1 — Tools
In this series that I’m creating, I’ll show to you how I created my template to work with Webpack and Vue.js inside an .NET MVC application.
- Part 1 — Tools;
- Part 2 — Project structure;
- Part 3 — NPM Packages;
- Part 4 — Webpack Configuration;
- Part 5 — Vue.js;
- Part 6 — Vuex;
Hello everyone.
After a lot of read, saw videos and wrote code, I built a template with .NET MVC (Framework 4.6.2), webpack, vue.js and a vuex bonus. It was a little bit hard to do, but I have success and I want to show to you my solution, that I think a lot of people search every day.
Feel free to make PR’s to the Github;
In this part of the story, I show what I used to built it:
- Visual Studio 2019 Community (2017/15/13 can be used too);
- Node.js;
- Any browser (I used chrome with vue devTools);
The goal of this project is not to work with any type of persistence or architecture for the MVC app, we will just manipulate front-end files to make things more modular and more automatic.
This will not be a SPA. We work with an multi page app, but we can have single file components, adding the vue-loader to webpack. For this example, I don’t use that.
If you don’t know what is Model-View-Controller, Single Page Application, Webpack, Vue.js or Vuex, I recommend to you read the concepts about these tools.
See ya.