部署Angular项目到GitHub Pages

于 2022-06-07 11:27:57 发布
阅读量443 收藏 1
点赞数
分类专栏： 前端 文章标签： 前端 github pages Angular
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u011069294/article/details/125161834
版权

使用angular官方提供的npm插件部署项目到GitHub Pages.
步骤：

  1. 执行下面命令，安装插件
ng add angular-cli-ghpages
  1. 执行下面命令，部署项目
    这条命令，会生成一个gh-pages分支，并且将Angular build生成的文件放到这个分支下面，并且将分支上传到GitHub仓库。
ng deploy --base-href=“https://pages.github.ibm.com/gqdeng/python-packages-zos/”
  1. 设置GitHub Pages
    打开项目的Settings，找到GitHub Pages，设置Source branch为gh-pages，目录为根目录。
  2. 参考资料：
    https://angular.cn/guide/deployment#deploy-to-github-pages
    https://github.com/angular-schule/angular-cli-ghpages
simpleGq
关注
专栏目录
将angular8项目部署到给github page页面（angular-cli-ghpages）
qq392213852的博客
11-01 698
一 、 注册github账号并创建github仓库（repository） 二 、 下载安装git工具（用到git命令），下载安装node.js(需要用到npm) 三 、 创建angular项目，初始化git，安装angular-cli-ghpages，构建部署
Angular学习笔记60：将Angular项目发布在GitHub pages页面上
W先生
09-09 474
现在将demo-test这个项目发布在GitHub pages这个的服务上 将项目进行构建打包并推送到GitHUb Angular官方文档中使用命令 ng build --prod --output-path docs --base-href // 经测试发现，这个命令不能达到我们想要的结果，会找不到页面或者报304，原因如下： github发布以后，形成的访问地址是https://w-abe...
【Angular】部署github.io上
gx_up
03-21 526
从一个网站链接到另外一个网站会产生新的http请求，referrer是http请求中表示来源的字段。 no-referrer-when-downgrade表示从https协议降为http协议时不发送referrer给跳转网站的服务器 no-referrer 任何情况下都不发送referer no-referrer-when-downgrade 在同等安全等级下（例如https页面请求https地址），发送referer，但当请求方低于发送方（例如https页面请求http地址）
使用angular-cli-ghpages部署Angular应用到GitHub
justforuse的博客
10-16 1570
GitHub有一个很实用的功能就是GitHub Pages，他相当于为Github项目建立了一个可视化的web页面。angular-cli-ghpages的功能就与这个类似。 首先新建一个Github空项目，比如angular-deploy 然后使用angular-cli工具生成一个新项目 安装angular-cli-ghpages包 npm install angular-cli-ghpages
杂七杂八（2）- 如何将Angular项目部署到GitHub上并运行
weixin_43477416的博客
11-01 701
众所周知GitHub是一个灰常好用的软件托管平台你可以将你的项目部署到你自己的GitHub的仓库中并且访问。
使用 Github Actions 自动部署 Angular 应用到 Github Pages的方法
10-15
主要介绍了使用 Github Actions 自动部署 Angular 应用到 Github Pages,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
angular-deploy-gh-pages-actions:Github动作自动将您的角度应用程序部署到GitHub页面
04-28
:rocket: Angular部署gh-pages操作 该将处理将角度应用程序部署到。 您可以配置创建构建后将部署的文件夹。 另外，您可以指定要部署到的分支。 入门 :flexed_biceps: 您可以在您的工作流中包括该操作，以在任何...
ngx-gh:直接从Angular CLI自动部署到GitHub页面
03-11
ngx-gh 是一个用于将 Angular CLI 项目直接部署到 GitHub Pages 的工具。它简化了将 Angular 应用程序发布到 GitHub Pages 的过程，通常这个过程包括构建、版本控制和手动配置。然而，根据描述，这个工具可能不再被...
samueldebartolo.com:samueldebartolo.com的存储库-使用Angular构建，使用GitHub Actions部署，并使用Gi​​tHub Pages托管
03-31
最后，“使用GitHub Pages托管”意味着网站的静态内容被发布到GitHub Pages，这是一个免费的服务，用于托管静态网站。 描述部分提到的“文件夹”可能是指项目结构，它通常包含Angular项目的各个组成部分，如src目录...
如何将已构建的angular 网页项目部署到github pages供他人访问
huoge666的博客
06-04 1187
1、将已构建完成的angular项目放到自己所创建github仓库中1.1例如我已构建的项目名叫testRouter如下1.2  在我的  Hi  仓库中，可以看到我已经把我得 testRouter 已放在上面,2、需要修改testRouter文件中的index.html文件的 <base href="/"> 这一行,修改完后，点击最左下角的commit保存起来3、接着设置master...
deploy-to-github-pages-action：GitHub操作，它将帮助您将应用程序部署到GitHub Pages的存储库中
02-05
deploy-to-github-pages-action：GitHub操作，它将帮助您将应用程序部署到GitHub Pages的存储库中
在github pages上部署Angular
power0405hf的专栏
03-03 1054
参考:http://blog.csdn.net/u014291497/article/details/78255645 我是先在git上建立repo，然后git clone到本地的，大概就是在本地新建angular项目后（ng new xxx）, ng build –prod –base-href=”https://USERNAME.github.io/ProjectName/”，最后的斜杠要加...
Angular项目部署到Gitee Pages中（教程）
qq_40020447的博客
10-21 323
前言 由于演示需要，需要将Angular项目部署到静态网页中，供他人浏览查看。 此项目没有任何与后端交互功能，因此，带API交互的不知道能否成功部署； 项目 Angualr版本为7 第1步 更改index.html 文件 将 <base href="/" > 改为 <base href="" /> 第2步 更改app-routing.module.ts 文件 配置如下： RouterModule.forRoot(routes,{useHash:true} 第3步 编译打包
如何将Angular7应用程序部署到Github Pages
沧海行云的专栏
09-19 320
首先，参照Angular官方文档：deploy-to-github-pages 按照如上步骤操作完毕，访问https://guohaolong.github.io/angular-threejs-practice发现页面空白。 打开浏览器的F12，发现index.html在加载js，css等静态资源时提示404。 于是，怀疑这个base-href不正确导致的。经查阅资料，最终发现需要将b...
Github Pages With Angular + Github Action
zomixi的博客
09-27 202
https://github.com/zomixi/ng-demo/blob/master/.github/workflows/update-github-pages.yml
如何在github显示angular项目网页
acn70501的博客
08-02 179
https://dzone.com/articles/how-to-deploy-an-angular-application-to-github 转载于:https://www.cnblogs.com/sulanlan/p/11287401.html
用 github 搭建自己的 angular 小网站
小妖666个人笔记
08-29 548
我使用的是基于 angular 的 ionic 框架，因为组件很丰富，并不需要自己去优化页面。 gitHub 下新建reallyEasy 项目 点击 settings 第一选项 Options 拉到最后 GitHub Pages 配置好点 Save 最上面是你的网站网址 新建 ionic 项目 更改 index.html 文件 <base href="/" /> 改为 <basehref="./"/> 不然发布到 github 后会导致加载资源失败...
AngularJS小项目
m0_37920381的博客
11-09 1156
1
4 angular 重构 项目_Angular项目使用github actions进行CI和发布
weixin_30605469的博客
01-09 190
CI/CDCI/CD翻译为持续集成/持续部署，对于软件开发而已是必不可少的，而且也是顺利成章的。持续集成的过程就是软件从从一个个commit持续变完善的过程，持续集成的目的是保证每个commit是安全的。我们在开发时确保：合理的模块分隔，每个提交单一功能原则，尽量减少新代码破坏原有代码的机会CI对每个提交进行安全性检查，一般是构建和测试。即使是比较大规模的代码重构提交，CI也能进行全局的安全性检查...
Angular 后端开发实战：sampleng-backend 项目部署与实践
资源摘要信息:"sampleng-backend:示例 Angular 后端" Angular后端应用程序示例 该资源是一个示例项目，用于展示如何构建...通过了解这些知识点，开发者可以更好地掌握如何搭建和配置后端环境，并部署Angular应用程序。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值