惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

人人都是产品经理
人人都是产品经理
MyScale Blog
MyScale Blog
Y
Y Combinator Blog
罗磊的独立博客
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
P
Proofpoint News Feed
Google DeepMind News
Google DeepMind News
V
Vulnerabilities – Threatpost
T
The Blog of Author Tim Ferriss
云风的 BLOG
云风的 BLOG
Recorded Future
Recorded Future
N
News and Events Feed by Topic
B
Blog RSS Feed
阮一峰的网络日志
阮一峰的网络日志
博客园_首页
C
CXSECURITY Database RSS Feed - CXSecurity.com
博客园 - 【当耐特】
N
Netflix TechBlog - Medium
博客园 - 叶小钗
B
Blog
Vercel News
Vercel News
T
Tenable Blog
T
The Exploit Database - CXSecurity.com
Spread Privacy
Spread Privacy
T
Threat Research - Cisco Blogs
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Last Week in AI
Last Week in AI
F
Fortinet All Blogs
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
Microsoft Security Blog
Microsoft Security Blog
S
Securelist
Microsoft Azure Blog
Microsoft Azure Blog
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
P
Palo Alto Networks Blog
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
D
DataBreaches.Net
Cyberwarzone
Cyberwarzone
Engineering at Meta
Engineering at Meta
Martin Fowler
Martin Fowler
G
GRAHAM CLULEY
Project Zero
Project Zero
Cisco Talos Blog
Cisco Talos Blog
A
Arctic Wolf
C
CERT Recently Published Vulnerability Notes
L
LangChain Blog
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
C
Check Point Blog
A
About on SuperTechFans
W
WeLiveSecurity
The GitHub Blog
The GitHub Blog

博客园 - 郎中令

锦衣夜行,AI乐园 Redis实战:用缓存为数据库减负(二) Redis初体验: 搭建与简单应用(一) .Net Core的SwaggerUI接口分类+固定路由 真实性编码:配置NLog日志+Seq分布式 防御性编码:手搓NLog日志+Seq分布式 对接Java所谓的DES加解密 人大金仓数据库转换 人大金仓踩坑指南 RSA加解密笔记 HTTPS请求笔记- SSL安全通道验证问题 .NetCore打包部署(DLL) 字典映射处理 SM4算法快速预览与Framework4.5版本对接 简易首页防暴力-字典计时器 记一次线上数据库异常的协助排查 降本增笑:记一次首页并发白屏优化过程 solr 基础介绍以及踩坑日记 动态展示缩放背景图
vite运行打包前端-部署Linux
郎中令 · 2024-05-08 · via 博客园 - 郎中令
前端相关参数配置

安装tsc依赖:    npm install @vue/tsconfig --save-dev

检查tsc版本   npx tsc --version

安装tys          npm install -g typescript

安装mockjs    npm install mockjs

安装cross       npm install cross-env --save-dev 

安装vite插件  npm install @vitejs/plugin-vue --save-dev

运行前端指令:npx vite --port=4000

要IP访问,需要在vite.config.ts 文件server节点下加入host配置,如{ ...,host:'0.0.0.0' } ,

   

   前置条件 安装node,vue, vite
   查看node版本 node -v

   安装打包服务指令:npm install -g http-server (只用安装一次)

  开始打包:

  1.npm run build -》生成dist静态目录
  2.cd dist目录 
  3.http-server  -》启用服务

以上命令用于本地运行,打包无问题

实际使用中,项目是部署到linux 等服务器上,针对服务器的部署,优先安装 nginx,或者http-server 服务

重启linux: reboot

重启nginx:   sudo systemctl restart nginx

查看Linux系统: lsb_release -a  , 如下图, 显示为 统信UOS系统(基于Linux内核)

nginx.conf 配置监听端口等参数:

server {
    listen 9090;
    server_name 192.168.1.888; # 替换为你的域名或IP地址
    root /website/vue; # 替换为Vue应用构建后的输出目录
    location / {
        try_files $uri $uri/ /index.html;
        
    }
    }

curl -s http://localhost:9090   指令访问网址,是否能输出index.html 文件内容

systemctl stop firewall  停用防火墙

systemctl start firewall  开启防火墙

有时候,curl可以访问,但是浏览器直接访问不行,网上90%的内容都是端口占用,防火墙问题,如果排除环境问题后仍然无法访问,可以考虑是否存在端口冲突,毕竟谷歌浏览器的端口限制还是挺多的

比如:6000,6665,6666, 6669等 ,

具体端口限制可以参数大佬文章:

配置链接

有时候规避掉这些端口号,仍然无法访问,还可能是端口号本身不支持开放给用户,如:3000,4000等,

具体端口开放:

配置链接

暂时记录到这里