Deploy Strapi web application

The silte - https://63fb6f1fe2abea782a935e05–netlify-strapi.netlify.app/

Github source - https://github.com/rustkas/netlify-strapi
PLEASE help us help you by writing a good post!

While rendering deployed files provides strange console errors:

The script from “https://63fb6f1fe2abea782a935e05--netlify-strapi.netlify.app/admin/main.67200bb9.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type. 63fb6f1fe2abea782a935e05–netlify-strapi.netlify.app
The script from “https://63fb6f1fe2abea782a935e05--netlify-strapi.netlify.app/admin/runtime~main.1b45df3f.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type. 63fb6f1fe2abea782a935e05–netlify-strapi.netlify.app
Uncaught SyntaxError: expected expression, got ‘<’ runtime~main.1b45df3f.js:1
Uncaught SyntaxError: expected expression, got ‘<’ main.67200bb9.js:1

How to tune Netlify deploy setting to get current result (with web application content as local version provides)?

Netlify cannot run/host Strapi. It needs a Node.js server as far as I’m aware.

Netlify can run/host Strapi.
There is plugin to deploy - strapi-plugin-netlify-deployments.
Thre is netlify cli which has option to deploy.
After Github pull request Netlify automatically make deploy.

Netlify of course use Node.js server capabilities.

Could you point me to the source of your information?

That doesn’t deploy Strapi to Netlify, it allows your to trigger deploys to your Netlify site (that doesn’t host Strapi) connected to your Strapi instance.

Deploying Strapi is not included/possible.

Irrelevant in this context.

Incorrect. Netlify uses Node.js to run your site builds, not to host your application.

I would like just use Netlify functionality.

How to setup deploy to Netlify properly?

Hi, @java1cprog. It looks like the issue is with the location of the deployed files.

I’m seeing 404s for URLs with paths like this:

/admin/runtime~main.78dfcead.js
/admin/main.ba3b8f64.js 

Those files don’t exist under the directory /admin. The correct paths for those two files are below (without the preceeding /admin):

/runtime~main.78dfcead.js
/main.ba3b8f64.js 

This can be confirmed by downloading the deploy.

I don’t know why the HTML is adding /admin to the paths. However, I would recommend finding the cause and fixing that first as it appears this is currently the blocker preventing the site from working as required.

/admin is virtual router of that SPA. Are there project example of successful deploying Strapi project to Netlify? Where to find it?

Can I get payed consultation for that topic?

Hi, @java1cprog.

Are there project example of successful deploying Strapi project to Netlify? Where to find it?

There are two different blog posts about Strapi here:

Can I get payed consultation for that topic?

Yes, but not from Netlify. There are numerous resources for that paid consultation. You can contract with individual web developers or with a web development agency.

Netlify is not a web development agency. We do not provide consulting for the code your write or the code written by third-parties. Our support team will provide troubleshooting for the services we provide and the code written by our developers. Custom or third-party code is not included in the scope of support.

You are welcome to ask here about this /admin path issue and someone else might be able to assist you. However, asking on a Strapi specific support forum might result in a faster answer.

Thank you very much for your assistance.

I hop I get useful suggestion here (I try).

I have got Strapi quick start project. Using netlify CLI I check Netlify deploy locally. All work correctly. I like it I would like using Netlify.
But when I deploy to my Netlify account that Strapi project do not work at all.

It would be nice if someone try to get latest version of Strapi and try to deploy that project to Netlify.
If for you will be ok. Please describe step by step what you to do to archive that success deploy.
Waiting to help with that.

Unfortunately that articles do not relevant - they do not describe simple way how to work Strapi with Netlify.
Simple way is:
1.Make Strapi quickstart project.
2.Push it to Github.
3.Connect it to new Netlify project.
4.Deploy Strapi project to Netlify remove system.

I hope someone do this simple thing with me and we together (maybe) write very useful article about our success deploy.

Hi @java1cprog we do not support this web application.

Ok. I see. Of course you are not support Strapi as web application. I do not write about that at all.
This question about integration. Netlify is integrated with Strapi. There is plugin for integration. Strapi successful deploy to Netlify. There are other option to deploy to Netlify too. But while starting Strapi web application (at Netlify side) remotely something wrong happens.

The question about how to escape that.

Please, if you can’t write anything useful, please, please don’t write anything.

I hope that there will be someone on this forum who understands this issue more than I do.

I am no longer interested in this question, since I came up with a different solution - without using both Netlify and Strapi.

Hi, @java1cprog. This is not a question about Netlify. You are asking a question about your own code and we will not debug the code you write.

Again, debugging the code you write isn’t covered in the scope of our support.

This is your deployed HTML:

<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="mobile-web-app-capable" content="yes"/><title>Strapi Admin</title><script defer="defer" src="/admin/runtime~main.78dfcead.js"></script><script defer="defer" src="/admin/main.ba3b8f64.js"></script></head><body><div style="min-height:100%" id="app"></div></body></html>

The issue is in these two script tags:

<script defer="defer" src="/admin/runtime~main.78dfcead.js"></script>
<script defer="defer" src="/admin/main.ba3b8f64.js"></script>

The issue is that /admin/ is added to both src attributes above. The correct tags are these:

<script defer="defer" src="/runtime~main.78dfcead.js"></script>
<script defer="defer" src="/main.ba3b8f64.js"></script>

I know with 100% certainty that Netlify isn’t causing this. I know this because your repo is public and I can test the build command outside of Netlify. What I find is this:

  • Even when Netlify is not used the HTML generated is incorrect.

I didn’t use Netlify’s build system. I didn’t deploy to Netlify. I just ran the build command on a VM and I get the same output - with zero Netlify code used. This proves that the bug is in your repo’s code. That isn’t anything Netlify will fix for you. You need to fix that code.

About this:

This is your code, not Netlify’s code. You need to answer that question above because it is about your code.

About this:

We are telling you something useful. We are telling you that this is your job to fix and that you are asking the wrong people this question. We are not here to debug your code. We are here to provide technical support for Netlify and our services. Your question isn’t about Netlify. Your question is about your code.

You are deploying that code to Netlify successfully. The code you deployed has a bug in it and Netlify doesn’t cause that bug.

All questions about how to deploy are answered. The only unanswered question is: “How does one remove the /admin string from the <script> tags?”. That is never Netlify’s responsibility to answer as we didn’t write the code with that bug.

Ok. I see. I understand you. But this console message just a side effect. My question is the last sentence of the post.

About this project.
This deployed code is just empty Strapi quick-start. Nothing special. I understand that console message claiming routing issue. Problem is not here.
All files project files are in one folder.

Pay attention about that -
Locally Netlify CLI launches that web application correctly. All routing provides content.
I launch this build file using netlify dev. All routing works currently. Not problem with /admin/ or other routing at all.

Launching Strapi web application while netlify deploy console print issue related to routing but only for deployed version of the some project. I think may be set Netlify system variable do not setup properly for remote deploy or maybe need figure out with netlify.toml.

My question for developers how has successful integration experience with remote Netlify deploy.

If you have such experience and may be understand how Netlify system work remotely and you maybe know answer for my question. I asked about that.

@java1cprog and @luke , just wanted to chime in here I’ve been struggling to get my Strapi instance on Netflify for like two days.

The HTML issue you found @luke is what Strapi magically produces as part of it’s build process. To build and develop Strapi, the user does not write HTML for the admin portal. And there is no non-admin front, as it’s a “Headless CMS” – as I am sure you are aware but you are speaking to us as if we created buggy HTML. We didn’t.

In addition, I’m not sure how it’s buggy as it works perfectly fine on local. It’s just when I deploy it I get 404 errors. Yet, my deployment does not show any errors from its dashboard.

I am going to back up Java1Cprog here, both Netlify and Strapi have marketing that they work together. There is a maintained plugin on the Strapi site. Anybody, developer or no, should be able to follow documentation on either site and end up with a working instance of Strapi.

Asking support engineers to debug our personal code is obviously a no go. But voicing that “I followed the documentation to the letter and it’s not working as advertised” should be something that Netlify cares about. If not the support engineering team, maybe the partner engineering team. The solution is probably not to fix our code: it’s either to fix the documentation on your side, Strapi’s side, or fix the plugin. And while you are not responsible for Strapi’s errors, if you are a sponsor of Strapi and advertise seamless deployment, somebody at Netlify should care here.

The goal of both Strapi and Netlify is to make using this kind of technology much easier. Thus far, nothing about it has been easy.

The documentation on both sites is very challenging to follow.

@luke here’s a fun error. Now the deployment can’t find an installed plugin.

10:54:33 PM: Core internal error                                           
10:54:33 PM: ────────────────────────────────────────────────────────────────
10:54:33 PM: ​
10:54:33 PM:   Error message
10:54:33 PM:   Error: Cannot find module "strapi-plugin-netlify-deployments"
10:54:33 PM:   Require stack:
10:54:33 PM:   - /opt/buildhome/node-deps/node_modules/@netlify/build/lib/utils/resolve.js
10:54:33 PM: ​
10:54:33 PM:   Error location
10:54:33 PM:       at Module._resolveFilename (node:internal/modules/cjs/loader:1134:15)
10:54:33 PM:       at Function.resolve (node:internal/modules/helpers:188:19)
10:54:33 PM:       at resolvePath (file:///opt/buildhome/node-deps/node_modules/@netlify/build/lib/utils/resolve.js:25:24)
10:54:33 PM:       at async resolveMissingPluginPath (file:///opt/buildhome/node-deps/node_modules/@netlify/build/lib/plugins/resolve.js:150:24)
10:54:33 PM:       at async Promise.all (index 0)
10:54:33 PM:       at async resolvePluginsPath (file:///opt/buildhome/node-deps/node_modules/@netlify/build/lib/plugins/resolve.js:37:29)
10:54:33 PM:       at async tGetPluginsOptions (file:///opt/buildhome/node-deps/node_modules/@netlify/build/lib/plugins/options.js:12:29)
10:54:33 PM:       at async tGetPluginsOptions (file:///opt/buildhome/node-deps/node_modules/@netlify/build/lib/time/main.js:18:63)
10:54:33 PM:       at async initAndRunBuild (file:///opt/buildhome/node-deps/node_modules/@netlify/build/lib/core/build.js:258:66)
10:54:33 PM:       at async runAndReportBuild (file:///opt/buildhome/node-deps/node_modules/@netlify/build/lib/core/build.js:154:165)
10:54:33 PM: ​
10:54:33 PM:   Error properties
10:54:33 PM:   { code: "MODULE_NOT_FOUND" }
10:54:33 PM: ​
10:54:33 PM:   Resolved config
10:54:33 PM:   build:
10:54:33 PM:     base: /opt/build/repo
10:54:33 PM:     command: npm run buildall
10:54:33 PM:     commandOrigin: config
10:54:33 PM:     environment:
10:54:33 PM:       - INCOMING_HOOK_BODY
10:54:33 PM:       - INCOMING_HOOK_TITLE
10:54:33 PM:       - INCOMING_HOOK_URL
10:54:33 PM:     publish: /opt/build/repo/build
10:54:33 PM:     publishOrigin: config
10:54:33 PM:   functionsDirectory: /opt/build/repo/netlify/functions
10:54:33 PM:   plugins:
10:54:33 PM:     - inputs: {}
10:54:33 PM:       origin: ui
10:54:33 PM:       package: strapi-plugin-netlify-deployments
10:54:33 PM:   redirects:
10:54:33 PM:     - force: true
10:54:33 PM:       from: /admin/runtime~main.*.js
10:54:33 PM:       headers:
10:54:33 PM:         Content-Type: text/html; charset=utf-8
10:54:33 PM:         X-Content-Type-Options: nosniff
10:54:33 PM:       to: /admin/runtime~main.*.js
10:54:33 PM:     - force: true
10:54:33 PM:       from: /admin/main.*.js
10:54:33 PM:       headers:
10:54:33 PM:         Content-Type: text/html; charset=utf-8
10:54:33 PM:         X-Content-Type-Options: nosniff
10:54:33 PM:       to: /admin/main.*.js
10:54:33 PM:   redirectsOrigin: config
10:54:34 PM: Failed during stage "building site": Build script returned non-zero exit code: 4
10:54:34 PM: Build failed due to an internal system error: Build script returned non-zero exit code: 4
10:54:34 PM: Failing build: Failed to build site
10:54:34 PM: Finished processing build request in 1m26.581s

@mpstaton is discussing here: How do we include a partner engineer on this forum for Strapi?

But to answer your points or concerns in this thread:

If you didn’t write that piece of code and can’t debug the issues with it, I think it’s a little unfair to expect that from us too. Even we’re not the ones who wrote anything here. We cannot debug what 3rd parties have written either.

This is a fairly incorrect argument. A lot of things would work locally because there’s a big difference between your local system and the production systems here. While ideally, it should work, but not just because it works locally. There might be bits and pieces to change before getting it work online.

We do care about that. You can see 1000s of posts on these forums where people complain about Netlify features not working as documented and we either:

  • find and fix the bug
  • help users workaround it
  • point out the errors in the userland side of things which can help them solve the issue
  • sometimes accept it as a limitation
  • file a feature request

Just because we sponsor something, we can’t start providing support for it. It won’t scale for our Support team as Netlify itself is a big product to completely learn about. Our Support team would have to be so big that we can then divide the team into “experts” of a particular area who only handle that area. Then we can possibly start providing support for things we sponsor.

Regarding advertising seamless deploment, I’d like to see what you’re referring to. Mind sharing the resources that advertised that? I don’t see anything in our official docs that talk about this.

Also when you make it sound like Netlify doesn’t care, that sounds like a pretty rude statement to make when asking for help the first time about an issue.