Nginx部署angular项目

最新推荐文章于 2024-05-23 11:22:18 发布
最新推荐文章于 2024-05-23 11:22:18 发布
阅读量6.2k 收藏 11
点赞数
分类专栏： Nginx 文章标签： nginx angular
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chending_cd/article/details/100730656
版权

简单点。

下载Nginx。具体可查看我之前写过的nginx安装方法https://blog.csdn.net/chending_cd/article/details/100557233

在确认nginx配置成功的情况下。即你输入ip可看到  

这个是重点。

 

angular部署很简单。

angular项目打包

ng build

 

打包完成会在根目录生成一个dist文件。例如我打包好了我的angular项目。

进去centos系统 在nginx/html 下放人 dist内打包好的文件。

修改nginx的conf配置文件

最低0.47元/天 解锁文章
叮叮叮会过去的
关注
  • 0
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Nginx中部署Angular项目遇到的坑巨坑
01-10
网上搜索Angular 项目编译后部署到 Nginx 中的方法，多数文章都介绍了需要在 Nginx 中的配置文件的 location 中特别指定跳转到首页来避免刷新导致404的问题，那么完整的server 代码是： server { listen 80; server_name 192.168.190.131; #sendfile on; #charset koi8-r; access_log /var/log/nginx/host.access.log main; location / { root /chanchaw/app/angular; index index
Angular项目部署到Nginx上
Moker_winddust的博客
09-21 2068
有关Angular项目在nginx部署
Nginx 配置文件详解
最新发布
新疆程序员阿达西的博客
05-23 988
Nginx 是一款高性能的HTTP和反向代理服务器，也是一个IMAP/POP3/SMTP代理服务器。HTTP配置部分几乎涵盖了Nginx的所有HTTP相关配置。以下是一个综合的Nginx配置示例，展示了如何配置多个虚拟主机和处理静态文件、反向代理等功能。本文将详细介绍其配置文件结构及常用的配置指令，以帮助你更好地理解和使用Nginx。全局配置部分用于设置Nginx服务器的全局参数，如用户、工作进程数、进程权限等。事件配置部分用于处理Nginx服务器的工作连接数和连接处理方式。块代表一个虚拟主机。
【angular-实践】nginx部署angular项目
qq_41243979的博客
01-04 3317
目录 nginx根目录部署angular项目 nginx子目录部署angular项目 其他方法-docker（未实践） readme 我的项目名叫qlnc-admin nginx用docker装的，nginx的/usr/share/nginx/html目录挂载在/home/nginx/html 一 nginx根目录部署angular项目 打包 ng build --prod 将生成文件夹dist/qlnc-admin中的qlnc-admin文件夹拷贝到/home/nginx/html根目录下
记录Nginx部署Angular项目的坑
weixin_48859602的博客
08-20 1615
我的服务器就只用80端口来完成前端和后端部署（以及多个项目部署），失去了可以区分项目或者前后端入口的端口号，我只能用uri来区分该指向哪个端口或文件，所以使用Nginx是在合适不过了。但是这路上太多坑，以至于我捣鼓了两天。下文出现该色号，代表问题所在目录前言一、后端代理1、如何将请求uri切割，将“标志”去除后转发到我的后端项目二、前端代理1、白屏，能访问到index.html但是无法获取到css/js资源2、正常点击很正常，一刷新就4043、我觉得的正确的部署前端。
SSM整合(Spring+SpringMvc+Mybatis)
qq_41971768的博客
09-09 611
SSM 整合 文件说明： springmvc.xml : 配置SpringMvc框架相关 springcontext.xml ： 配置Spring容器 和整合mybatis
nginx部署angular+javaweb
12-01
如果你需要在服务器根目录下配置前端项目，同时要部署其他的后端项目，这个配置可以帮到你
Angular项目从新建、打包到nginx部署全过程记录
08-28
在讲解过程中，我们将按照新建项目、打包和Nginx部署的顺序进行。 首先，让我们从新建一个Angular项目开始： 1. **安装Node.js**：在开始之前，确保已安装Node.js，它是Angular开发的基础。 2. **安装淘宝npm镜像*...
涵盖了 Java、Qt、AI、R 语言以及 Linux 学习的学习类开源项目
代码讲故事
10-07 325
涵盖了 Java、Qt、AI、R 语言以及 Linux 学习的学习类开源项目。 1.Springboot-Learning 项目作者：程序猿 DD 项目地址：https://gitee.com/didispace/SpringBoot-Learning Spring Boot基础教程的程序样例，这个项目的目标是打造全网内容最全，比收费教程更好的Spring Boot免费教程。 2.SpringCloud-Learning 项目作者：程序猿 DD 项目地址：https://gitee.com/didispac
nginx中配置angular项目_如何在Nginx中正确地配置Location？
weixin_30069113的博客
01-06 324
Nginx中location指令的作用是根据用户请求的URI来执行不同的应用，根据用户请求的网站地址URI进行匹配，匹配成功即进行相关的操作。在nginx的 ngxhttpcore_module模块的location标签的匹配原则之前，我要先介绍一下nginx的echo模块，它可以帮助我们检测配置的location标签是否正确，是否达到配置的目的。编译安装echo模块Nginx的echo模块介绍e...
Nginx 入门(一) -----nginx的作用与安装
jym的博客
03-11 1936
Nginx： 什么是nginx： Nginx 是高性能的 HTTP 和反向代理的服务器，处理高并发能力是十分强大的，能经受高负载的考验,有报告表明能支持高达 50,000 个并发连接数。 nginx作用： 反向代理 负载均衡 动静分离 反向代理:对比正向代理 正向代理:需要在客户端配置代理服务器进行指定网站访问 就好比找人帮你去超市买水，你需要告诉这个人，超市的地址，买多少钱的，什么牌子的… ...
nginx中配置angular项目_centos7下nginx部署angular项目
weixin_35976825的博客
12-24 249
1.创建前端项目目录进入/var文件夹cd /var在/var目录下创建www文件夹mkdir www进入/var/www目录，创建test文件夹cd www #进入www目录mkdir test2.将前端编译后的文件上传到/var/www/test目录3.配置nginx下test目录及选项进入/etc/nginx/conf.d/目录cd /etc/nginx/conf.d/打开default.c...
angular引入包、路由权限配置、打包问题与nginx配置问题（简单部署）
热门推荐
编程知识分享，主打前端
08-08 3万+
浅使用angluar
在 nginx 中部署 angular 应用
程序员进阶之路
10-15 1万+
最近使用Angular做了第一个应用，但是网上的教程大多是教如何开发，部署相对较少，所以这里就简单记录一下如何在nginx中部署Angular应用。 注：Angular应用可以编译成静态页面，然后部署在任何 web 服务器上，这里仅仅是选择nginx而已，同时编译后的文件其实就仅仅是静态文件而已，与其它 html 文件本质上无异。 一、编译 前提： 请确保@angular/cli已经安装 在
Angular4项目nginx服务器部署
Rnger的博客
04-12 2119
Angular4项目nginx服务器部署1.  Nginx相关操作命令：Ø  ubuntu安装：$ sudo apt-get install nginx 安装完成即可，在/usr/sbin/目录下是nginx命令所在目录，在/etc/nginx/目录下是nginx所有的配置文件，nginx.conf文件用于配置nginx服务器以及负载均衡等信息；Ø  查看nginx进程是否启动：$ ps -ef|...
angular项目部署使用nginx做代理
Web魔法师
07-09 1416
1.nginx 安装： 参考：https://blog.csdn.net/zuoyigehaizei/article/details/93061002 https://blog.csdn.net/by0920/article/details/87937646 2. 在angular项目下执行:ng build命令：命令执行完会生成dist文件夹dist/DeviceAdmin 例如我打包好了我的angular项目：/home/deviceweb/DeviceManageWeb/dist/Dev.
nginx部署angular8项目
assassin_0302的博客
07-10 794
参考链接：https://www.cnblogs.com/defaultlee/p/9223564.html https://www.cnblogs.com/panxiaoming/p/6024063.html 直接上步骤 1.使用ng build 打包 --base-href 会在html的<head>中 增加<base ...
部署angular项目
08-18
要部署 Angular 项目，你需要执行以下步骤： 1. 生成生产环境构建：在终端中导航到你的 Angular 项目根目录，并运行以下命令生成生产环境构建： ``` ng build --prod ``` 这将在 `dist/` 目录中生成编译好的文件。 ...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值