reactjs 如何使用ftp服务器(如filezilla)将next js应用程序(不使用vercel)部署到客户服务器

s5a0g9ez  于 2022-12-29  发布在  React
关注(0)|答案(2)|浏览(280)

我可以在react js中不使用vercel将next js应用程序部署到自定义服务器吗?我过去使用build文件夹进行部署,在next js中使用FTP服务器,我不知道要上传哪些文件,请提供帮助?

owfi6suc

owfi6suc1#

1.第一个月
1.在src外部创建文件deploy.js
1.把这个代码放在上面:

var FtpDeploy = require('ftp-deploy');
var ftpDeploy = new FtpDeploy();
require('dotenv').config({ path: '.env.local' });

var config = {
  user: process.env.FTP_USER,
  // Password optional, prompted if none given
  password: process.env.FTP_PASS,
  host: process.env.FTP_HOST,
  port: process.env.FTP_PORT || 21,
  localRoot: __dirname + '/build',
  remoteRoot: process.env.FTP_REMOTE_ROOT,
  // this would upload everything
  include: ['*'],
  // e.g. exclude sourcemaps, and ALL files in node_modules (including dot files)
  exclude: [],
  // delete ALL existing files at destination before uploading, if true
  deleteRemote: process.env.FTP_DELETE,
  // Passive mode is forced (EPSV command is not sent)
  forcePasv: true,
};

ftpDeploy
  .deploy(config)
  .then((res) => console.log('finished ;)'))
  .catch((err) => console.log(err));

ftpDeploy.on('uploading', (d) => {
  console.log(
    `${d.transferredFileCount} / ${d.totalFilesCount} => ${d.filename}`
  );
});

ftpDeploy.on('upload-error', function (data) {
  console.log('upload-error =>', data.err); // data will also include filename, relativePath, and other goodies
});

然后,请在env文件中键入您的数据库信息,并在此文件中键入变量名

sh7euo9m

sh7euo9m2#

首先,我修改了我的package.json文件,因为“npm run build”命令将同时执行两个命令(next build && next export),如下所示。x1c 0d1x
然后我执行了npm run build命令,运行良好,并显示了如下所示的警告消息。
然而,当我通过ftp将“out”文件夹中的所有文件上传到服务器的根目录时,它运行良好。
我想通知大家,我使用了fetch调用和axios调用从CORS后端获取数据,这些调用也没有任何问题。
希望这个答案能有所帮助..!

相关问题