swup
Ignore visits from the Astro integration #984
-
Describe your problem 🧐I'm using Astro along with Swup for page transitions and Sanity Studio as my CMS, which is hosted under /admin. I want to completely disable Swup when users visit /admin so that it loads normally without interference. What is your question? 🙋♀️Does the Astro Swup integration provide an option to exclude certain paths (e.g., /admin) from Swup? If not, what would be the best way to achieve this? I didn't see an ignoreVisit or similar option in the integration's config. I would appreciate any recommendations or workarounds to handle this properly. Thanks in advance! URL to minimal reproduction 🔗localhost:4321/admin Checked all these? 📚
|
Beta Was this translation helpful? Give feedback.
Replies: 5 comments 27 replies
-
|
Hi! The Astro integration doesn't have an In the meantime, you can set an option to make swup available on the global window object, and set the // astro.config.js
import { defineConfig } from 'astro/config'
import swup from '@swup/astro'
export default defineConfig({
integrations: [
swup({
globalInstance: true
})
]
}
);<!-- Layout.astro -->
<!DOCTYPE html>
<html>
<head>
<script>
const setup = () => {
window.swup.options.ignoreVisit = (url) => url.startsWith('/admin')
}
if (window.swup) {
setup()
} else {
document.addEventListener('swup:enable', setup)
}
</script>
</head> |
Beta Was this translation helpful? Give feedback.
This comment has been hidden.
This comment has been hidden.
This comment has been hidden.
This comment has been hidden.
-
|
Thank you for looking into this. I couldn't get your solution working, but I will wait for an official fix. |
Beta Was this translation helpful? Give feedback.
-
|
Wow awesome thank you! I'm sure it will help. |
Beta Was this translation helpful? Give feedback.
-
|
Just for clarification: we're not talking about installing swup into the Astro frontend part of your Sanity project, that's perfectly fine. The part that wouldn't make sense is installing swup into the Sanity studio itself. Which you're probably not doing? The idea is to only install swup into the |
Beta Was this translation helpful? Give feedback.
-
|
I've structured it the same way as they do in the official guide: https://github.com/ChrisLaRocque/sanity-astro But no it's not the same structure as the link you posted where Sanity has it's own package.json |
Beta Was this translation helpful? Give feedback.
-
|
Alright, fascinating. Didn't know about the official Sanity integration. It seems to host the studio in the same Astro instance as the frontend itself. In that case, ignore our previous advice. I'm strictly in separate-repo land mentally :) The new |
Beta Was this translation helpful? Give feedback.
-
|
You'll still need a way not to initialize swup on the routes where your studio is rendered, but I'm afraid we can't really help there. That project structure is interesting but very alien to me 🧃 |
Beta Was this translation helpful? Give feedback.
-
|
I see the issue now :) You have to remove the |
Beta Was this translation helpful? Give feedback.
-
|
Using |
Beta Was this translation helpful? Give feedback.
-
|
See Named Element IDs Can Be Referenced as JavaScript Globals as an explanation of the issue at hand. Was news to me :) |
Beta Was this translation helpful? Give feedback.
-
|
Unfortunately, I’m still getting the same errors. :( It's not a huge issue since I’ll be the one adding the content, not the client, but the admin experience isn’t ideal with all the glitches |
Beta Was this translation helpful? Give feedback.
-
|
We've published version 1.6.0 of the Astro integration which allows ignoring links. You should be good to go with this option: swup({
ignore: ['/studio']
}) |
Beta Was this translation helpful? Give feedback.
-
|
Thank you will try it out first thing tomorrow! 🙏 |
Beta Was this translation helpful? Give feedback.
-
|
Just wanted to report back that it works like a charm! |
Beta Was this translation helpful? Give feedback.
We've published version 1.6.0 of the Astro integration which allows ignoring links. You should be good to go with this option: