linux部署前端react项目

 

一、配置linux环境

1、安装node和npm

1)在node官网下载对应node安装包:http://nodejs.cn/download/

      可以通过命令:uname -a   查看当前系统内核;

      也可通过命令:wegt +node下载地址(没用这个,可自行百度)。

2)下载之后上传到服务器,然后创建node目录,解压安装node

tar xvf node-v12.13.0-linux-x64.tar.xz #解压
mv node-v12.13.0-linux-x64 nodejs #改短名

    

cd /nodejs/bin  #进入目录
./node -v  #查看node版本

 

      如果查看node版本时提示找不到GLIBCXX和GLIBC版本,需升级对应版本库(可自行百度)。

3)配置软链接

      需要创建软链接,以便全局使用

ln -s /usr/local/nodejs/nodejs/bin/node /usr/local/bin/node
ln -s /usr/local/nodejs/nodejs/bin/npm /usr/local/bin/npm

    执行完此命令后可通过  node -v和npm -v查看相应版本信息

4)配置node环境变量

划重点:后面用serve -s部署项目时,会找不到指令

进入配置文件 

vi /etc/profile

按 i 键进入编辑模式,进入文件末尾添加:

export NODE_HOME=/usr/local/nodejs/nodejs/bin
export PATH=$NODE_HOME:$PATH

然后按 ESC 键 ,在控制台输入:wq,回车保存退出。

使配置文件立即生效

sourse /etc/profile

5)安装serve

npm install -g serve   

部署react项目时需要用到此命令

6)安装react脚手架

npm install -g create-react-app

二、打包、部署react项目

1、打包项目

我们是用creat-react-app创建的前端项目,在控制台使用如下命令可打包项目,项目根目录会生成build文件夹

npm run build

将文件夹打包发送至linux服务器,解压。

然后记录build文件夹,使用如下命令启动项目

serve -s

linux部署前端react项目_第1张图片

到这步之后访问不成功,百思不得其解,欢迎大家吐槽,顺便告诉我怎么玩。

三、其他部署方法

经同事测试,可以将build文件夹放在tomcat里webapps下的ROOT文件夹中,然后需要将build文件夹的权限修改成可读可写可执行

chmod 777  build

然后直接启动tomcat即可访问项目。

你可能感兴趣的:(前端,react,linux,react)