The team is now working on the WordPress Interactivity API. This unblocks the same UX Frontity framework enabled but directly in WordPress Core, fully compatible with the new Site Editor.
First of all, I’m really new in Frontity and sorry if my questions are so simple. I have looked for the answer in the forum, but I couldn’t find anything that helps me.
I have finished my website on my local machine and now it is time to deploy it!
I have been following the different steps for deploying it to Vercel, but I can’t get it.
For what I understood, I have to upload to Vercel the Frontity project and to my web host the project of Wordpress (in a subdomain). Then, redirect the Vercel app to the domain where I would like to show the website. Is it correct? Or am I missing something?
If I am correct, I try to upload to Vercel the Frontity project, but there is an “Internal Sever Error”. Do I have to upload only the files inside the build folder after doing npm run build?
Thanks a lot in advance.
J.
appevolver20222
create file vercel.json and paste the below content.
Push your code on repo and then run command > npx vercel --prod
You will then have to authenticate Vercel and then changes will be deployed on Vercel
jordigarreta113
Hi @appevolver2022 Thanks for your reply.
I have added the vercel.json file you told me, but I still have the same Internal Server Error… Here you have the link of the app: https://my-frontity-project-eta.vercel.app/
This is the Deployment Status I received:
[15:32:48.292] Retrieving list of deployment files...
[15:32:51.547] Downloading 54 deployment files...
[15:32:53.056] Looking up build cache...
[15:32:53.348] Build Cache not found
[15:32:53.385] Running "vercel build"
[15:32:53.885] Vercel CLI 28.4.7
[15:32:53.900] WARN! Did you mean to deploy the subdirectory "build"? Use `vc --cwd build` instead.
[15:32:54.014] WARN! Due to `builds` existing in your configuration file, the Build and Development Settings defined in your Project Settings will not apply. Learn More: https://vercel.link/unused-build-settings
[15:32:54.025] > Installing Builder: @frontity/now
[15:32:55.880] Downloading user files...
[15:32:55.889] Warning: Detected "engines": { "node": "14.15.0" } in your `package.json` with major.minor.patch, but only major Node.js Version can be selected. Learn More: http://vercel.link/node-version
[15:32:55.903] Installing dependencies...
[15:32:55.903] Detected `package-lock.json` generated by npm 7+...
[15:32:56.957] npm WARN EBADENGINE Unsupported engine {
[15:32:56.958] npm WARN EBADENGINE package: 'frontity-react@1.0.0',
[15:32:56.958] npm WARN EBADENGINE required: { node: '14.15.0', npm: '7.24.2' },
[15:32:56.958] npm WARN EBADENGINE current: { node: 'v14.20.0', npm: '8.11.0' }
[15:32:56.958] npm WARN EBADENGINE }
[15:33:02.985] npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
[15:33:03.763] npm WARN deprecated source-map-url@0.4.1: See https://github.com/lydell/source-map-url#deprecated
[15:33:03.843] npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
[15:33:03.868] npm WARN deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecated
[15:33:04.138] npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
[15:33:04.530] npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
[15:33:09.656] npm WARN deprecated chokidar@2.1.8: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
[15:33:14.349]
[15:33:14.349] added 944 packages in 18s
[15:33:14.350]
[15:33:14.350] 60 packages are looking for funding
[15:33:14.350] run `npm fund` for details
[15:33:14.368] Running "build" script in "package.json"
[15:33:14.375] Detected `package-lock.json` generated by npm 7+...
[15:33:14.375] Running "npm run build"
[15:33:14.670]
[15:33:14.670] > frontity-react@1.0.0 build
[15:33:14.670] > frontity build
[15:33:14.670]
[15:33:16.270]
[15:33:16.271] - mode: production
[15:33:16.271] - target: both
[15:33:16.271] - public-path: /static/
[15:33:16.271]
[15:33:16.300] Building es5 bundle
[15:33:32.119]
[15:33:32.119] asset size limit: The following asset(s) exceed the recommended size limit (488 KiB).
[15:33:32.119] This can impact web performance.
[15:33:32.120] Assets:
[15:33:32.120] frontity-react.es5.deaa3729f19cc39b2bad.js (709 KiB)
[15:33:32.120]
[15:33:32.120] entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (488 KiB). This can impact web performance.
[15:33:32.120] Entrypoints:
[15:33:32.120] frontity-react (709 KiB)
[15:33:32.120] frontity-react.es5.deaa3729f19cc39b2bad.js
[15:33:32.120]
[15:33:32.120]
[15:33:32.120] webpack performance recommendations:
[15:33:32.120] You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
[15:33:32.121] For more info visit https://webpack.js.org/guides/code-splitting/
[15:33:32.121]
[15:33:32.121] Building module bundle
[15:33:42.149]
[15:33:42.149] asset size limit: The following asset(s) exceed the recommended size limit (488 KiB).
[15:33:42.149] This can impact web performance.
[15:33:42.149] Assets:
[15:33:42.150] frontity-react.module.bad4472f03e4212c67ab.js (552 KiB)
[15:33:42.150]
[15:33:42.150] entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (488 KiB). This can impact web performance.
[15:33:42.150] Entrypoints:
[15:33:42.150] frontity-react (552 KiB)
[15:33:42.150] frontity-react.module.bad4472f03e4212c67ab.js
[15:33:42.151]
[15:33:42.151]
[15:33:42.151] webpack performance recommendations:
[15:33:42.151] You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
[15:33:42.151] For more info visit https://webpack.js.org/guides/code-splitting/
[15:33:42.151]
[15:33:42.152] Building server bundle
[15:33:53.543]
[15:33:53.681] Finished.
[15:33:53.699] Build Completed in /vercel/output [58s]
[15:33:56.526] Generated build outputs:
[15:33:56.526] - Static files: 5
[15:33:56.526] - Serverless Functions: 1
[15:33:56.527] - Edge Functions: 0
[15:33:56.527] Serverless regions: Washington, D.C., USA
[15:33:56.527] Deployed outputs in 2s
[15:33:57.390] Build completed. Populating build cache...
[15:33:57.590] Uploading build cache [400.71 kB]...
[15:33:58.186] Build cache uploaded: 596.235ms
[15:33:58.201] Done with "."
Thanks a lot!
1600tc4
Hi, i’ve had this issue, simply remove your package-lock.json from your repo( eg add it on .gitignore) and let the server build its own. This happened because of a conflict between React version I guess
