imhotepp/vuejs-devpc repository overview

⁠Vue.js docker local development

⁠Introduction

This dockerfile was created for developers who want to try vuejs or want to develop vue.js applications without installing @vue/cli on their pcs or laptops.

It has already installed: nodejs⁠, npm⁠, git⁠ and @vue/cli⁠.

⁠Prerequisites

• Docker⁠ must be installed on the local machine
• Visual Studio Code⁠ must be installed on local machine
• Remote - Containers⁠for Visual Studio Code must be installed on local machine
• Vetur⁠ - nice to have Visual Studio Code extension

⁠Installation

Create a folder github in the folder where you want to save your projects.

Run with mounting folder:

docker run -v ${PWD}/github:/github --workdir /github --name vuejs-devpc -it imhotepp/vuejs-devpc:latest

The above command will start the vuejs-devpc container and attach the local folder github to it. It will also set the current directory to github. That will become your current folder for all Vue.js⁠ applications.

⁠Development

Once the installation was finished and the docker run .... command executed all that is needed to start or continue development is to :

• start the Docker Dashboard,
• search for vuejs-devepc and then
• start the container.

After the container starts just attach from visual studio code Remode - Container extension and start development

⁠Test the image

Assuming the container started and you are connected to it using the Remote - Container extension, open a termina from Visual Studio Code and run the following commands:

• vue create my-app 
  

  Copy
  and select from options Vue 2 and Yar and then wait for the installation to finish

• cd my-app && yarn serve 
  

  Copy
  once the application is up and running on port 8080 just open a browser and navigate to http://localhost:8080 and the Vuejs app will become visible.

Any updates you'll do inside the container from Visual Studio Code will become immediately available in the browser.

@imhotepp