How to Deploy Vue Project in Nuxt to my Ubuntu Server
i configured my server using pm2 and apache2 but when loading using the ip address it doesn't fetch data from the backend
but when i test1 in the server machine by localhost:3002 it working fine ,test2 access in the server machine by the server actual ip:3002 same issue doesn't fetch data from backed
Please help me :vsf:
10 Replies
Hi @Tomy 👋 , check out this open source deployment guide. https://docs.vuestorefront.io/cookbook/oss-deployment-guide
Vue Storefront Docs
OSS Deployment Guide
In this guide we'll show you how to deploy an Open Source Vue Storefront application to a production server.
Thanks @rohrig for your response am checking the guide before that
in me local pc am working in vuestorefront project when i run with
yarn dev -> it gave me the http://10.10.20.55:3001
but when i browse its not working but
when i use http://localhost:3001 it working fine instead of the ip address
here is my nuxt configuration :
import webpack from 'webpack';
import { getRoutes } from './routes';
import theme from './themeConfig';
export default {
server: {
port: process.env.PORT 3001,
host: '0.0.0.0',
// protocol:'https'
},
env: {
GRAPHQL_API: process.env.GRAPHQL_API 'http://localhost:3000/shop-api',
SECRET_KEY: process.env.SECRET_KEY,
ACCESS_KEY: process.env.ACCESS_KEY,
PROFILE_ID: process.env.PROFILE_ID,
},
I'm guessing port 3000 was already taken so it tried 3001.
I'm also a bit confused about your port settings . . . are you attempting to run nuxt on port 3000 and the middleware also on port 3000?
i need to run in port number 3001 and the backend run in port number 3000
it think discord remove from my configuration
port: process.env.PORT 3001
GRAPHQL_API:process.env.GRAPHQL_API || 'http://localhost:3000/shop-api'
when i browse using localhost:3001 working fine
but when i browse using :
[dev:*theme] ℹ Listening on: http://10.10.4.160:3001/
i need to test in my local server without additional configuration
both the middleware and nuxt should be reachable via localhost
If you're deploying somewhere, you need to set up a reverse proxy so that both applications can run on the same server.
I show you how to do that in the guide I linked above
here is the middleware configuration :
process.env.NODE_TLS_REJECT_UNAUTHORIZED = '0';
module.exports = {
integrations: {
vendure: {
location: '@vue-storefront/vendure-api/server',
configuration: {
api: {
uri: process.env.GRAPHQL_API,
// to be used later with authentication
tokenMethod: process.env.TOKEN_METHOD,
},
},
},
},
};
Thanks @rohrig
i fixed my issue
By oss development guide
before deploying to local server only for testing or production we should have valid SSL certificate if not there is CORS error..
1ST i used pm2 to start my service and acquire domain name ssl after that i follow the documentation and its working Thanks!