I'm in the process of deploying a simple Vue application on Cloud Foundry. Below is the code for the single-page Vue application:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>title</title>
<script src="static/vue.js"></script>
</head>
<body>
<div id="app">
{{ message }}
</div>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
</script>
</body>
</html>
The vue.js file can be found at .
Upon trying to view the deployed application, I encountered the following issue: https://i.sstatic.net/K9T1m.png
Specifically in Chrome, I noticed that <div id="app">
was showing up as <!---->
.
I conducted a test to verify if the vue.js file was being executed in Chrome, and it was. However, I'm puzzled by the differing behavior between production and local environments. The app functions correctly in both browsers when run locally.
Thank you!