AWS EC2 CodeDeploy 不会从 Angular dist 文件夹加载 JavaScript

Question

我正在使用 Bitbucket Pipelines + AWS CodeDeploy + AWS EC2 实例来运行我的角度应用程序。管道运行良好，代码是动态构建的，然后对于 EC2，它只上传 dist/文件夹。然后，当我尝试访问我的页面时，css文件和js文件未加载。

我尝试使用堆栈溢出中的另一种解决方案，但没有任何效果。EC2 在 Ubuntu 18.04 上的 apache2 上运行。

我试图授予执行js文件的权限，但它也不起作用。

所有文件都位于同一目录中。

/deployment-id/deploment-archive/
-index.html
-runtime.js
-main.js
-polyfills.js
-runtime.js
-styles.css

索引.html

<script type="text/javascript" src="runtime26209474bfa8dc87a77c.js"></script>
<script type="text/javascript" src="es2015-polyfillsbda95d5896422d031328.js" nomodule></script>
<script type="text/javascript" src="polyfills8bbb231b43165d65d357.js"></script>
<script type="text/javascript" src="maindcabcbb8258040c4d925.js"></script>

目前，它仅呈现空白页面，我在控制台中收到警告"源 www.myawslink.com/main.js 加载失败"

当我尝试直接访问文件时，apache 说"找不到 404 个文件"，但是当我通过 putty 连接到 ec2 时，我看到部署目录中的文件带有 index.html。我希望页面正确呈现并且 js 文件正常工作。

Answer 1

好的，问题出在 apache2 上。

因为文件是从/var/www/html/提供的，在我的 appspec.yml 中，我只包含索引.html这里

所以我从这个改变了

- source: /index.html
destination: /var/www/html/

对此

- source: /dist
destination: /var/www/html/

现在一切都很完美。

我的 bitbucket-pipeline.yml 看起来像这样

pipelines:
default:
- step:
name: build angular
image: node:10
caches:
- node
script:
- npm install
- npm install -g @angular/cli
- ng build --prod
artifacts:
- dist/**
- step:
name: deploy
image: python:3.5.1
script:
- apt-get update # required to install zip
- apt-get install -y zip # required for packaging up the application
- pip install boto3==1.3.0 # required for codedeploy_deploy.py
- zip -r /tmp/artifact.zip dist/* scripts/* appspec.yml package.json # package up the application for deployment
- python codedeploy_deploy.py # run the deployment script