Installing Vue CLI

• You use the Vue CLI to create projects, generate application and library code, and perform a variety of ongoing development tasks as it is a progressive framework for building user interfaces.

• Install the Vue CLI globally.

• To install the CLI using npm, open a terminal/console window and enter the following command:

  npm install -g @vue/cli 

Create Initial application

• 1. Run the CLI command vue create and provide the name my-app, as shown here:

  vue create my-app

• 2. The vue create command prompts you for information about features to include in the initial app project. Accept the defaults by pressing the Enter or Return key.

Serve Application

• 1. Go to the workspace folder (my-app).

  cd my-app

• 2. Launch the server by using the CLI command npm start

  npm run serve

Supplemental

Build Application

• 1. Build you application for host on server using below command:

  npm run build

• 2. It will create one dist file in your theme folder. Make zip of dist folder. so here you are ready to upload your theme on server.

  If you’re using Apache HTTP Server, you need to create a .htaccess file in the public folder by pastng below code

  Options -MultiViews
  RewriteEngine On
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteRule ^ index.html [QSA,L]

• Now upload your dist folder on public folder

Making Sub-folder on Server

• By default it host on your server root, If you wish to upload on sub-folder then:
• 1. Go to your theme and open vue.config.js and add your subfolder name here:

  module.exports = {
    baseUrl: "/cuba/",
    publicPath: "/cuba/"
  };

• 2. open route >> index.js in object of router replace base attribute with

  base: '/cuba/'

• Now again build theme using

  npm run build  

• Now create a .htaccess file in your subfolder folder by pastng below code

  Options -MultiViews
  RewriteEngine On
  RewriteBase /cuba/
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteRule ^ index.html [QSA,L]

• Now upload your dist folder in sub folder
• Supplemental

If you have already download and install node.js and Vue CLI then ignore prerequisites accordingly.

Node.js

• Download latest version of node.js from nodejs.org.

• Install Node.js using downloaded file

• To check your node version, run node -v in a terminal/console window.

Vue CLI

• Install Vue CLI Using:

  npm install -g @vue/cli 

Setup Cuba theme by

• 1) Download and extract an Cuba themes from themeforest
• 2) Extract it and then go in to theme folder.

  cd theme

• 3) Import all dependency by installing npm command

  npm install

• 4) Now you are in stage to successfully run Cuba using below command:

  npm run serve