综合项目部署——eleme前端部署（eighteen day）

显示没有空格没有注释的内容：

root@static-server \~\]# grep -Ev "#\|\^$" /usr/local/nginx/conf/nginx.conf

1、多虚拟主机的配置

root@static-server \~\]# vim /usr/local/nginx/conf/nginx.conf \[root@static-server \~\]# /usr/local/nginx/sbin/nginx #启动nginx服务 创建项目，用于部署在nginx中发布到网络 \[root@static-server \~\]# mkdir /xiaojiang \[root@static-server \~\]# echo "hello,i am xiaojiang" \> /xiaojiang/index.html \[root@static-server \~\]# cat /xiaojiang/index.html hello,i am xiaojiang \[root@static-server \~\]# vim /usr/local/nginx/conf/nginx.conf 5 http { 6 include mime.types; 7 default_type application/octet-stream; 8 sendfile on; 9 keepalive_timeout 65; 10 11 server{ 12 listen 80; 13 server_name www.xiaojiang.com; 14 root /xiaojiang; 15 location / { 16 index index.html; 17 } 18 } \[root@static-server \~\]# vim /etc/hosts 192.168.1.11 www.xiaojiang.com #最后一行加这个 \[root@static-server \~\]# /usr/local/nginx/sbin/nginx -s reload \[root@static-server \~\]# curl www.xiaojiang.com hello,i am xiaojiang \~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~ 如果想在物理机浏览器上访问到www.xiaojiang.com,则需要以下操作 物理机打开此位置C:\\Windows\\System32\\drivers\\etc 记事本打开hosts 最后一行加入 ( 192.168.1.10 www.xiaojiang.com) 替换文件 \~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~ 将刚才配置的server模块保存到一个新的文件中 \[root@static-server \~\]# sed -n "10,19p" /usr/local/nginx/conf/nginx.conf server{ listen 80; server_name www.xiaojiang.com; root /xiaojiang; location / { index index.html; } } \[root@static-server \~\]# mkdir /usr/local/nginx/conf.d/ \[root@static-server \~\]# sed -n "10,19p" /usr/local/nginx/conf/nginx.conf \> /usr/local/nginx/conf.d/xiaojiang.conf \[root@static-server \~\]# cat /usr/local/nginx/conf.d/xiaojiang.conf server{ listen 80; server_name www.xiaojiang.com; root /xiaojiang; location / { index index.html; } } \[root@static-server \~\]# sed -i "10,19d" /usr/local/nginx/conf/nginx.conf #删除10\~19行的内容 \[root@static-server \~\]# vim /usr/local/nginx/conf.d/xiaojiang.conf include ../conf.d/\*.conf; \[root@static-server \~\]# /usr/local/nginx/sbin/nginx -s reload

2、基于IP的地址访问不同的虚拟主机

创建新的IP挂在这个网课上

root@static-server \~\]# ifconfig ens160:1 192.168.1.88 \[root@static-server \~\]# ifconfig ens160: flags=4163\ mtu 1500 inet 192.168.1.11 netmask 255.255.255.0 broadcast 192.168.1.255 inet6 fe80::cad1:833a:a57c:8cc3 prefixlen 64 scopeid 0x20\ ether 00:0c:29:4d:db:fd txqueuelen 1000 (Ethernet) RX packets 3795 bytes 361264 (352.7 KiB) RX errors 0 dropped 0 overruns 0 frame 0 TX packets 2587 bytes 329330 (321.6 KiB) TX errors 0 dropped 0 overruns 0 carrier 0 collisions 0 ens160:1: flags=4163\ mtu 1500 inet 192.168.1.88 netmask 255.255.255.0 broadcast 192.168.1.255 ether 00:0c:29:4d:db:fd txqueuelen 1000 (Ethernet) 这个IP地址可以正常使用 \[root@static-server \~\]# vim /usr/local/nginx/conf.d/xiaojiang.conf server{ listen 80; server_name 192.168.1.88; root /xiaojiang; location / { index index.html; } } \[root@static-server \~\]# vim /usr/local/nginx/conf/nginx.conf server { listen 80; server_name 192.168.1.11; location / { index index.html; } \[root@static-server \~\]# /usr/local/nginx/sbin/nginx -s reload  \~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~

3、基于端口的虚拟主机

root@static-server \~\]# vim /usr/local/nginx/conf.d/xiaojiang.conf server{ listen 8080; server_name 192.168.1.11; root /xiaojiang; location / { index index.html; } } \[root@static-server \~\]# /usr/local/nginx/sbin/nginx -s reload  仅限于公司内部测试 \~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~

4、上线一个静态的前端系统

nodejs 安装npm添加vue模块，使用vue创建vue3项目，构建静态资源，将静态资源添加到nginx项目中

在安装nodejs之前，需要检查是否安装epel

root@static-server \~\]# yum list installed \| grep epel #检查是否安装了epel \[root@static-server \~\]# yum -y install epel-release \[root@static-server \~\]# yum -y install nodejs \[root@static-server \~\]# node -v #检查是否安装nodejs（运行环境） \[root@static-server \~\]# yum -y install npm \[root@static-server \~\]# npm -v \[root@static-server \~\]# npm config set registry https://registry.npmmirror.com#安装淘宝镜像 \[root@static-server \~\]# npm install @vue/cli #安装vue脚本架（必须要进行前面一步） \[root@static-server \~\]# ls -l /root/node_modules/.bin/vue lrwxrwxrwx 1 root root 22 7月 31 14:40 /root/node_modules/.bin/vue -\> ../@vue/cli/bin/vue.js \[root@static-server \~\]# /root/node_modules/.bin/vue -V @vue/cli 5.0.8 #创建vue项目（eleme） \[root@static-server \~\]# /root/node_modules/.bin/vue create eleme_web   \[root@static-server \~\]# cd eleme_web/ \[root@static-server eleme_web\]# npm run serve 物理机浏览器访问[http://192.168.1.11:8081/](http://192.168.1.11:8081/ "http://192.168.1.11:8081/") \[root@static-server eleme_web\]# nohup npm run serve\& \[1\] 1730 \[root@static-server eleme_web\]# nohup: 忽略输入并把输出追加到"nohup.out" \[root@static-server eleme_web\]# tail -f nohup.out \[root@static-server eleme_web\]# fg nohup npm run serve \[root@static-server eleme_web\]# yum -y install samba 编辑配置文件 \[root@static-server eleme_web\]# vim /etc/samba/smb.conf （最后一行加以下内容） \[eleme_web

comment=xiaojiang
path=/root/eleme_web
guest ok=no
writable=yes

root@static-server eleme_web\]# useradd vueediter #创建用户 \[root@static-server eleme_web\]# smbpasswd -a vueediter New SMB password:123 Retype new SMB password:123 Added user vueediter. #为该用户在文件夹中添加读写权限 \[root@static-server eleme_web\]# setfacl -m u:vueediter:rwx /root/eleme_web/ 启动服务 \[root@static-server eleme_web\]# systemctl start smb.service \[root@static-server eleme_web\]# systemctl start nmb.service \[root@static-server eleme_web\]# ls -l public/ 总用量 12 -rw-r--r-- 1 root root 4286 7月 31 15:04 favicon.ico -rw-r--r-- 1 root root 611 7月 31 15:04 index.html \[root@static-server eleme_web\]# mkdir public/img \[root@static-server eleme_web\]# mkdir public/video \[root@static-server eleme_web\]# mkdir public/music \[root@static-server eleme_web\]# tree public/ public/ ├── favicon.ico ├── img ├── index.html ├── music └── video \[root@static-server eleme_web\]# yum -y install nfs-utils.x86_64 \~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~\~ **部署nfs服务器（eleme-static）** \[root@eleme-static \~\]# yum -y install rpcbind.x86_64 \[root@eleme-static \~\]# yum -y install nfs-utils.x86_64 \[root@eleme-static \~\]# vim /etc/exports /static/img/ \*(rw,sync) \[root@eleme-static \~\]# mkdir -p /static/img/ \[root@eleme-static \~\]# systemctl start rpcbind.service \[root@eleme-static \~\]# systemctl start nfs \[root@eleme-static \~\]# netstat -lnput \| grep rpc #查看端口是否开启 \[root@static-server components\]# cd .. \[root@static-server src\]# ls views/ AboutView.vue HomeView.vue \[root@static-server src\]# vim views/HomeView.vue \ \

\ \ \ \ \ // @ is an alias to /src import HelloWorld from '@/components/HelloWorld.vue' export default { name: 'HomeView', components: { HelloWorld } } \ \[root@static-server eleme_web\]# nohup npm run serve\&