Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
398 views
in Technique[技术] by (71.8m points)

Aurelia Routing: Unable to load page when I enter the url with route

I am new to Aurelia framework and working with the contact manager tutorial on their website.

When I load the page starting from the default url: "http://localhost:9002" then proceed to "http://localhost:9002/contacts/2" it works fine. But when I attempt to load the page with just the url "http://localhost:9002/contacts/2" it fails to load, then checking the console (F12) i can see it is failing to load several .css and .js bundles. See image below. What can I do? enter image description here


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

Why the error occurs

This error occurs because for your browser searches for the .css and .js files at "http://localhost:9002/contacts/" instead of "http://localhost:9002/" where your SPA serves these files from.

When using an SPA, you should explicitly set the base url of your page (typically) to the SPA root by adding <base href="/"> within your <head> element, otherwise your browser simply searches for resources relative to the current url.

What to do

If you are using the latest aurelia-cli (v2.0.2 at the time of this answer) with Webpack, your index.ejs file should have the following line;

<base href="<%- htmlWebpackPlugin.options.metadata.baseUrl %>">

which pulls its value from a constant in your webpack.config.js file.

In webpack.config.js update the line

const baseUrl = '';

to

const baseUrl = '/';

Your resources should load properly afterwards.

Further reading


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...