Built Marko app cannot be located outside root context of host

[fineline]

Bug Report

Context

The standard Marko build process produces an index.html with links that will only work if the file is in the root path of its host. So if you deploy your app within a nested path (e.g. example.com/department/marko-app/index.html) none of the links load.

Steps to Reproduce

Using the http-server npm module to replicate this:

• npm install -g http-server
• Create a new marko project and change into its folder
• npm run build
• http-server
• Browse to localhost:8080/dist

Expected Behavior

Marko app should be displayed correctly

Actual Behavior

Marko app is displayed but all style / js links have failed

Possible Fix

Make links relative to index.html instead of absolute to host root

Additional Info

Your Environment

"marko": "^4.2.4", "marko-starter": "^1.0.0"

[fineline]

For anyone else having this problem, here's an additional script to run after Marko build to fix it:

const fs = require("fs.promised")
const indexPath = "../dist/index.html"

async function main() {
    let html = await fs.readFile(indexPath, "utf8")
    html = html.replace(/src="\//g, "src=\"").replace(/href="\//g, "href=\"")
    await fs.writeFile(indexPath, html)
}

main()

[austinkelleher]

I think what you want is to set the staticUrlPrefix. Create a project.js file in the root of your marko-starter project and add the following:

module.exports = require('marko-starter').projectConfig({
  staticUrlPrefix: '/whatever-prefix' // Defaults to '/'
})

See the markojs-website for an example of a project.js file: https://github.com/marko-js/markojs-website/blob/master/project.js

Does this work for you? We need to document these features. The marko-starter config is located here: https://github.com/marko-js/marko-starter/blob/master/src/models/Project.js

[fineline]

@austinkelleher Thanks, that is very helpful. I found specifying an empty string for staticUrlPrefix left it at the default, but specifying "./" worked to get me my relative paths.