I have a angular 2 SPA running from within a SharePoint 2010 document library. However, I have a problem with routing. When I start the application by running "index.html", the link in the browser shortly displays:
<server>/scripts/angular_app/index.html
When the application is loaded it changes to:
<server>/scripts/angular_app/#/information-system
'information-system' is the default route of my application.
So far, so good.
If I do a reload of the page now, SharePoint loads its default view:
<server>/scripts/angular_app/Forms/AllItems.aspx
This is because the routing removes the 'Index.html' from the url and SharePoint loads the default which is 'AllItems.aspx' and not 'index.html'.
Is there any way of telling the angular 2 routing system to leave the 'index.html' bit in the url?
Thanks for any help!
Joachim
I added following line to index.html to keep index.html in the URL all the time:
<base href="/index.html">
I solved my issue by extending the base href with the filename at compile time:
ng build --dev --bh /scripts/filingangular/index.html
I was not aware that you could put an actual filename here.
Related
I am deploying my website powered by vue vith vue-router(history mode) to gituhb pages using vite builder.
So I got a problem: Github Pages is returning 404 error each time I reloading the page with non-root path.
Adding cp dist/index.html dist/404.html seems like solution. The page is displaying correctly but GitHub is returning 404 status. And this is an important problem because search engines skipping paths in my sitemap.xml that returns 404 status code. That is, all non-root paths.
I'm preparing to deploy my first Static app from a Nuxt.js 2 project.
While the static routes are generated fine, my dynamic routes are not. Once I remembered they were hidden in my dropdown menu - duhh - I created a /generate page which renders all my dynamic routes using the nuxt-link component. My assumption was that the crawler should find the /generate/index.vue page and thus the links on it, and crawl those.
It didn't.
Then I noticed a comment from Sebastien Chopin mentioning that SSR should be enabled when generating Static apps. Ok. So I re-enabled SSR and I've hit nothing but errors. A couple I've figured out but this latest one has got me stumped.
Some googling has not revealed a clue that appeared relevant - or at least I didn't recognise them as relevant - so I need the 'worldwide developers' team help.
Does this error suggest there's an issue in Vue itself? I don't use 'self' anywhere in my app code soooo... hmmm?
Cheers,
Jeremy
Well it's generating now (has been for a few weeks, been a busy time!)... however the generated pages are not outputting with content, but I think that's a different issue.
My configuration currently is;
target: 'static',
ssr: false,
generate: {
minify: false, // Nuxt 2.15.4 > Deprecated next major version > Use build.html.minify instead!
routes: dynamicRoutes
}
I'll keep working on it.
I've gone through several Stack Overflow pages and the official Vue guide, but my app still returns 404 results when going to a different page.
The structure of my app looks like this, with a client folder that has the Vue app and a server folder containing app.py that statically serves the index.html in the client/dist folder through Flask.
Contents of static.json are as outlined in the guide:
{
"root": "client/dist",
"clean_urls": true,
"routes": {
"/**": "index.html"
}
}
with just modified root folder to go to client/dist. Running the app locally with npm run serve works, as does opening it up on its Heroku page and clicking on the nav. However, directly going to a page, such as /translate, always returns 404.
I have installed the following buildpacks:
=== readiglot Buildpack URLs
1. heroku/nodejs
2. heroku/python
3. https://github.com/heroku/heroku-buildpack-static
The app is hosted here: https://www.readiglot.herokuapp.com.
On npm run build from the root directory, the dist folder is built by Heroku in the client folder.
Am I missing something? Could anyone advise as to additional configuration?
The answer is in the app.py file - you need to statically serve the file using a catch all route.
#app.route("/", defaults={"path": ""})
#app.route("/<string:path>")
#app.route("/<path:path>")
def index(path):
return app.send_static_file("index.html")
By putting the serve_static_file in the Flask app to redirect from all other routes, 404 only shows up on a true 404.
Just started using Nuxt, and I love it so far. I just have one specific issue, I'm using prismic.io as headless CMS for my personal page. I have a few pages and a "blog" page. I'm having an issue when navigating to the blog route, it returns page not found. Now, it's kind of odd because it's working perfectly in my local host, it's just behaving that way when deployed.
Site's being deployed on Netlify.
I already tried switching the route's links and building the project on my local machine and it's working like charm.
Link to site:
https://wonderful-gates-27a024.netlify.com/
This is my file structure for the pages:
Pages/
-- blog/
---- _uid.vue
-- About.vue
-- Blog.vue
-- Contact.vue
-- Works.vue
-- index.vue
Steps to replicate the issue
Navigate to about
Navigate to contact
Navigate to blog (Sometimes the error shows on this step)
Click on an article
Navigate back to the blog (here it should display not found)
Steps to navigate back to blog after the error shows up:
On the url bar, paste wonderful-gates-27a024.netlify.com/blog and hit enter.
I'm getting page not found error
It works sometimes because you are navigating to
https://wonderful-gates-27a024.netlify.com/blog/
Which is different from
https://wonderful-gates-27a024.netlify.com/blog
the page which is /blog
https://wonderful-gates-27a024.netlify.com/blog
doesn't exist while the page
https://wonderful-gates-27a024.netlify.com/blog/
exists. which is /blog/_uid
so if you want it to work make
Pages/
-- blog/
---- _uid.vue
---- index.vue// make this file and the /blog will work
-- About.vue
-- Blog.vue
-- Contact.vue
-- Works.vue
-- index.vue
We just had this error occur and it was caused by renaming About.vue to about.vue on a MacOS machine.
Git doesn't recognize it as a new file, so when you deploy the app on a Linux machine, the problem occurs.
The solution is to rename the file from a Linux machine, so that git recognizes it.
You could also probably accomplish it by renaming the file from Blog.vue to new-blog.vue and then renaming it again to blog.vue.
This is all caused by the fact that files aren't case sensitive on MacOS but they are on linux. You will see it where you have:
<NuxtLink :to="{ name: 'blog' }">
It must be blog.vue to match the route name because the filename leads to the route name. On Linux, the crawler will name the route "Blog" if it is Blog.vue.
You don't want uppercase filenames with nuxt, because they will lead to URLs such as /Blog. I don't recommend having uppercase in your pages directory.
We've now released the updated nuxt-prismic module to solve this dynamic routes issue and enable previews. You see how to migrate your project by following this article:
https://prismic.io/docs/vuejs/getting-started/the-new-prismic-nuxt-module
Also you can see a project enabled with the module already here:
https://user-guides.prismic.io/en/articles/2831943-nuxt-js-sample-multi-page-website-with-navigation
I'm working on my first Vue app, which uses the Moment library and Firebase (if that matters). I use default Webpack simple. To deploy the app I did npm run build.
But when opening directly index.html (the app is deployed here) I get "Failed to load resource: the server responded with a status of 404 (Not Found)" error message and the app doesn't work at all as a result.
I have no idea how to troubleshoot this issue since there's no more information that this in DevTools...
Any idea about what I can do next?
App source code
Remove the first forward slashes of all your assets path.
It should fix your problem.
<script src="/dist/build.js"></script> // No!
<script src="dist/build.js"></script> // Yes!
Vue adds it by default during the build process, in order to make your assets relative to the root folder.