这里通过AngularCLI创建的项目可以通过ngbuild命令来完成项目的打包发布
当build命令执行完成后，项目根路径下dist文件夹中以项目名称命名的文件夹就是我们需要部署的文件。此时，如果是部署到自己的服务器上，只需要把这个文件夹拷贝到服务器上，通过nginx之类的服务器指向文件所在路径即可
同样的，当我们想要部署到githubpage时，我们也只需要将文件提交到github代码仓库中即可，之后github会自动完成应用的部署工作
因为git默认是会忽略编译生成的dist文件夹的，此时，想要把编译生成的文件推送到远程仓库，你需要修改.gitignore文件，或是通过subtree的形式，将dist文件夹作为一个分支推送到远程服务器
| #创建并切换到gh-pages分支 gitcheckout-bgh-pages #将dist文件夹下的文件添加到gh-pages分支 gitadd-fdist #提交到本地分支 gitcommit-m'createdgh-pages' #推送到远程分支 gitsubtreepush--prefixdistorigingh-pages |
| ngaddangular-cli-ghpages |
| ngdeploy--base-href=/ingos-admin/ |
因为每次执行ngdeploy命令时都需要在命令中添加base-href参数，所以这里我们可以在package.json文件中添加一个script，这样当后面我们需要发布时，直接执行自定义的ngdeploy命令即可
| { "name":"ingos-admin", "version":"1.0.0", "scripts":{ "ng":"ng", "start":"ngserve", "build":"ngbuild", "deploy":"ngdeploy--base-href=/ingos-admin/", "test":"ngtest", "lint":"nglint", "e2e":"nge2e" } } |
| #ThisisabasicworkflowtohelpyougetstartedwithActions name:CI #Controlswhentheactionwillrun.Triggerstheworkflowonpushorpullrequest #eventsbutonlyforthemasterbranch on: push: branches:[master] pull_request: branches:[master] #Aworkflowrunismadeupofoneormorejobsthatcanrunsequentiallyorinparallel jobs: #Thisworkflowcontainsasinglejobcalled"build" build: #Thetypeofrunnerthatthejobwillrunon runs-on:ubuntu-latest #Stepsrepresentasequenceoftasksthatwillbeexecutedaspartofthejob steps: #Checks-outyourrepositoryunder$GITHUB_WORKSPACE,soyourjobcanaccessit -uses:actions/checkout@v2 #Runsasinglecommandusingtherunnersshell -name:Runaone-linescript run:echoHello,world! #Runsasetofcommandsusingtherunnersshell -name:Runamulti-linescript run:| echoAddotheractionstobuild, echotest,anddeployyourproject. |
| steps: #Checks-outyourrepositoryunder$GITHUB_WORKSPACE,soyourjobcanaccessit -uses:actions/checkout@v2 #Installnodejs -name:SetupNode.jsenvironment uses:actions/setup-node@v1 with: node-version:12.x #Cachenodemodules -name:Cachenodemodules uses:actions/cache@v2 env: cache-name:cache-node-modules with: #npmcachefilesarestoredin`~/.npm`onLinux/macOS path:~/.npm key:${{runner.os}}-build-${{env.cache-name}}-${{hashFiles('**/package-lock.json')}} restore-keys:| ${{runner.os}}-build-${{env.cache-name}}- ${{runner.os}}-build- ${{runner.os}}- #Installrequireddependenciestobuildapp -name:Installdependencies run:npmci |
| steps: #Useangular-cli-ghpagestodeployapp -name:Deploytogithubpages env: GITHUB_TOKEN:${{secrets.GITHUB_TOKEN}} run:npmrundeploy |
| { "name":"ingos-admin", "version":"1.0.0", "scripts":{ "deploy":"ngdeploy--no-silent--base-href=/ingos-admin/--name='账户名'--email='密码'", } } |
| #Thisisabasicworkflowtodeployangularappintogithubpages name:DeployGithubPages #Controlswhentheactionwillrun.Triggerstheworkflowonpushorpullrequest #eventsbutonlyforthemasterbranch on: push: branches:[master] #Aworkflowrunismadeupofoneormorejobsthatcanrunsequentiallyorinparallel jobs: build: #Thetypeofrunnerthatthejobwillrunon runs-on:ubuntu-latest #Stepsrepresentasequenceoftasksthatwillbeexecutedaspartofthejob steps: #Checks-outyourrepositoryunder$GITHUB_WORKSPACE,soyourjobcanaccessit -uses:actions/checkout@v2 #Installnodejs -name:SetupNode.jsenvironment uses:actions/setup-node@v1 with: node-version:12.x #Cachenodemodules -name:Cachenodemodules uses:actions/cache@v2 env: cache-name:cache-node-modules with: #npmcachefilesarestoredin`~/.npm`onLinux/macOS path:~/.npm key:${{runner.os}}-build-${{env.cache-name}}-${{hashFiles('**/package-lock.json')}} restore-keys:| ${{runner.os}}-build-${{env.cache-name}}- ${{runner.os}}-build- ${{runner.os}}- #Installrequireddependenciestobuildapp -name:Installdependencies run:npmci #Useangular-cli-ghpagestodeployapp -name:Deploytogithubpages env: GITHUB_TOKEN:${{secrets.GITHUB_TOKEN}} run:npmrundeploy |
