vuecli项目部署服务器,五步带你完成vue-cli 项目打包一键部署(测试)服务

初始化vue项目, 测试服务已经准备(前提已经准备好了)

注意: 一键部署 vue2.0~3.0 都可以使用

1、在根目录 新建deploy 文件夹:

104381f2750c210fc0f850c7303903c9.png

.env.dev类容如下

VUE_APP_SERVER_ID=0

.env.prod类容如下

VUE_APP_SERVER_ID=1

index.js 文件类容如下:

const scpClient = require('scp2');

const ora = require('ora');

const chalk = require('chalk');

const server = require('./products');

const spinner = ora('正在发布到' + server.name + '服务器...\n');

const spinnerCopy = ora('正在备份到' + server.name + '服务器...\n');

const ssh2 = new (require('ssh2').Client)(); // 版本新增

const compressing = require('compressing');

// 生成zip压缩包的名字(根据自己的需要自定义)

const filePath = "./" + (new Date()).getTime() + server.assetsRoot.replace('./', '') + ".zip";

ssh2.on('ready', () => {

console.log(chalk.green('连接服务成功...'));

ssh2.exec("rm -rf " + server.path + '/static', (err,stream)=> {

console.log(chalk.green('正在删除缓存历史文件...\n'));

if (err) {console.log(chalk.red('删除失败.\n')); throw err;}

stream.on("close", ()=>{

ssh2.end();

uploadFile();

backups();

});

});

}).connect({

host: server.host,

port: server.port,

username: server.username,

password: server.password,

path: server.path

<
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue CLI 4项目部署服务器的其他目录下,可以按照以下步骤进行操作: 1. 首先,确保服务器已经安装了Node.js和npm。 2. 在本地开发环境中,使用Vue CLI 4创建一个新的Vue项目。可以通过在终端中运行以下命令来完成: ``` vue create my-project ``` 根据提示选择需要的特性和配置,创建一个新的Vue项目。 3. 进入项目目录: ``` cd my-project ``` 4. 在本地终端中,在my-project项目中运行以下命令进行构建: ``` npm run build ``` 这将生成一个dist目录,其中包含了构建后的所有静态文件。 5. 将dist目录中的所有文件上传到服务器的目标目录。 可以使用FTP工具,如FileZilla,将dist目录中的文件上传到服务器的目标目录中。 6. 在服务器中安装一个基本的HTTP服务器。 可以使用Nginx或Apache等HTTP服务器将静态文件提供给客户端。确保服务器已经安装并正确配置。 7. 配置HTTP服务器以提供Vue项目的静态文件。 对于Nginx服务器,可以在Nginx的配置文件中添加以下配置: ``` server { listen 80; server_name your-domain.com; root /path/to/your/target-directory; index index.html; location / { try_files $uri $uri/ /index.html; } } ``` 将"your-domain.com"替换为你的域名,将"/path/to/your/target-directory"替换为你的目标目录。 8. 保存配置文件并重新启动HTTP服务器。 对于Nginx服务器,可以通过运行以下命令重新加载配置: ``` sudo service nginx reload ``` 这样就完成了将Vue CLI 4项目部署服务器其他目录下的过程。 以上是将Vue CLI 4项目部署服务器其他目录下的简要步骤。你可以通过适当调整和配置来满足你的具体要求和服务器环境。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值