> For the complete documentation index, see [llms.txt](https://iron-network.gitbook.io/vuely/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://iron-network.gitbook.io/vuely/vuely-vuejs/deployment.md).

# Deployment

To create a production build you need to run the command `npm run build`. It will create the `dist` folder, that contains the production build files. Now you just need to upload the `dist` files on to the server.

#### Static Server:

To run the production build locally, the easiest way to handle this would be to install [serve](https://github.com/zeit/serve) and let it handle the rest: 

```
npm install -g serve
serve -s dist
```

You don’t necessarily need a static server in order to run a project in production. It works just as fine as integrated into an existing dynamic one.

Here’s a programmatic example using [Node](https://nodejs.org/) and [Express](http://expressjs.com/):

{% code title="server.js" %}

```javascript
const express = require('express');
const path = require('path');
const app = express();

​app.use(express.static(path.join(__dirname, 'dist')));

​app.get('/', function (req, res) {  
    res.sendFile(path.join(__dirname, 'dist', 'index.html'));
});

​app.listen(9000);
```

{% endcode %}

**Apache HTTP server:**

If you’re using [Apache HTTP Server](https://httpd.apache.org/), you need to create a `.htaccess` file in the `public` folder that looks like this:

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

Upload the `dist` files in the public folder.

#### Building for Relative Paths:

By default, vue-cli 3 produces a build, assuming your app is hosted at the server root. To override this, follow the instructions given below:-

Create a `.htaccess` file in the sub directory.

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

Open `vue.config.js` file and change the `baseUrl` from `'/'` to `'/sub-folder/'`

```javascript
...
module.exports = {
    baseUrl: process.env.NODE_ENV == 'production' ? 'sub-folder' :  '/',
    ...
}

...
```

Change all static assets path with your directory path e.g. `"/static/img/user-1.jpg"` with `"/sub-folder/static/img/user-1.jpg"`

Add base in the router config file, go to the `src->router` and open `index.js` file.

```javascript
// session components
const SignUpOne = () => import('Views/session/SignUpOne');
const LoginOne = () => import('Views/session/LoginOne');
const LockScreen = () => import('Views/session/LockScreen');

const Auth0CallBack = () => import('Components/Auth0Callback/Auth0Callback');

Vue.use(Router)

export default new Router({
	mode: 'history',
	base: '/sub-folder', // add here your sub-directory name
	routes: [
    	...
    ]
})
```

Run `npm run build` command.

Upload the `dist` folder files on the sub-folder directory.

For more information, please check the link below:

{% embed url="<https://cli.vuejs.org/guide/deployment.html#general-guidelines>" %}

That's it, Now your production build will work on the relative path.