Clock gets shown twice in production build
When I run the ./run.sh build
-command and deploy the resulting files via nginx the clock gets shown twice.
The commands I use can be seen in the prod target of the Dockerfile, though I'll lay the relevant parts out here too:
-
npm install
(to install all dependencies) -
mv config/docker.env .env
(to use the docker.env file which sets all settings in the env-variable syntax) -
./run.sh build
(to build the project) -
cp /aura/public/build /usr/share/nginx/html
to copy the resulting files to the nginx-directory
The resulting index html looks like follows:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<title>Aura Engine - Studio Clock</title>
<link rel='icon' type='image/png' href='/favicon.png'>
<link rel='stylesheet' href='aura-clock-bundle.css'>
<script defer src='aura-clock-bundle.js'></script>
</head>
<body style="background-color: black;">
<aura-clock />
</body>
</html>
(Note that only one <aura-clock />
tag exists)
When I look directly at the page source in the browser (via the right click menu - "View Page Source") I also get the source code of the index.html as above.
Opening the Inspect Menu though, I see two aura-clock-tags:
Also the clock gets shown twice and the screen flickers on every update due to it scrolling up and down again while updating the clocks info.
My nginx default.conf (so the config with the server-directive) looks as follows:
server {
listen 80;
server_name $MASKED_SERVER_NAME;
location / {
root /usr/share/nginx/html;
index index.html;
try_files $uri $uri/ /index.html;
}
}
I've attached the generated aura-clock-bundle.js and aura-clock-bundle.js.map.