Search for a command to run...
Upload NextJS's out folder to your remote server's application path at `npm run build` time
No comments yet. Be the first to comment.
Clean your email list even before sending it to a mass emailing solution like AutoSend to avoid a high bounce rate
Try using an alternative to openclaw, which they claim is cheaper to use
Using types (and interfaces) to define a blueprint of a variable
Using GraphQL as an alternative to REST API for Hashnode
making makemigrations work in Django when migrations is not pushed to git
Install 2 packages as development dependencies (will be set to devDependencies in the same package.json that's used for the NextJS application): I realize we're having the same package.json file for the NextJS application and the nodeJS script - that's not an issue, just make sure that the nodeJS packages we're using for this upload functionality are saved as dev only.
npm i node-scp dotenv --save-dev
Create a .env file with the following details :
HOST="mydomain.com"
USERNAME="username"
PASSWORD="MyPassword"
PORT="22"
LOCAL_FOLDER="./out"
REMOTE_FOLDER="/home/myUsername/apps/myNextJSApp"
I am using OpalStack where each application's root path is pre-set to ~/apps/appName, so my REMOTE_FOLDER is /home/myUsername/apps/myNextJSApp - but for most other hosting companies, it'll be something like /home/myUsername/public_html
Next, create an upload.mjs file in the root directory as the NextJS app - we need to save the file as a .mjs file though since we can't set "type": "module" in package.json file which is being used by NextJS also. Enter into upload.mjs :
import * as dotenv from 'dotenv'
import { Client } from 'node-scp';
dotenv.config();
var remote_server =
{
host: process.env.HOST,
port: process.env.PORT,
username: process.env.USERNAME,
password: process.env.PASSWORD,
// forceIPv4: boolean,
// forceIPv6: boolean,
// privateKey: fs.readFileSync('./key.pem'),
// passphrase: 'your key passphrase',
}
const upload = async () =>
{
try
{
const client = await Client(remote_server);
console.log("Uploading .... ");
await client.uploadDir(process.env.LOCAL_FOLDER, process.env.REMOTE_FOLDER);
client.close();
console.log("Upload Done");
}
catch (e)
{
console.log(e);
}
}
upload();
Now edit the package.json file to include this :
"build": "next build && next export && node upload.mjs",
After you've tested your app via npm run dev, you can now run npm run build and it'll build and export followed by uploading your out folder (which is the default NextJS's build folder) to your server's NextJS path.