Note: This guide has been updated for use with @vue/cli
version 4! Please make sure you're using the latest version of @vue/cli
.
When it comes to starting new Vue projects, you can't really beat Vue CLI. The Vue team has done a phenomenal job of making an easy-to-use tool for getting started with reasonable defaults. If you're using Django though, you may not have the easiest time getting its static system and webpack to play well together.
A good chunk of this is applicable to any webpack-compiled frontend and Django, but we'll focus specifically on the steps involved with Vue CLI.
As a quick heads up: this tutorial assumes you're creating your Vue project in a folder named frontend
inside of your Django project folder. If you want it named something else, or want it in a different folder, just update the paths accordingly.