Having trouble deploying to production

[durkie]

Hi there -- I've been very pleased with svelte-rails in development, and would love to get it to production, but just cannot for the life of me figure out how to successfully get it to work.

If I take my existing app (Rails 6.0.1) and start with no webpacker, I add gem 'webpacker' to my Gemfile, and do the following:

bundle install
rails webpacker:install
rails webpacker:install:svelte

(installs webpacker 5.1.1 gem)

then I add gem 'svelte-rails' to the Gemfile and run the following:

bundle install
rails svelte:install

(installs svelte-rails 0.3.3 gem)

I make sure to put application.js in to app/javascripts/packs and run bin/webpack. The first issue is encountered here:

Error: Cannot find module 'svelte_ujs_ng/getSvelteEnvironments'

I change this to 'svelte_ujs_ng/svelte_ujs/getSvelteEnvironments' in environment.js and re-run bin/webpack successfully. This works in development but not in production.

I can then start the rails server and see my <%= svelte_component %> tags working as they should.

If I then deploy this to production (elastic beanstalk), I get an error in the asset compilation stage:

Error: Cannot find module 'svelte_ujs_ng/svelte_ujs/getSvelteEnvironments'

Okay, change it back. Running bin/webpack at this point then ends with the error:

Error: Waited too long for "manifest.json" to exist.
    at Timeout.poll [as _onTimeout] (/var/app/ondeck/node_modules/svelte_ujs_ng/svelte_ujs/WaitPlugin.js:24:17)

and this is the point where I get stuck. I can't find any combination of settings to get through this. I've tried changing the timeout in WaitPlugin from 30s to 300s, and it still times out. I've tried changing compile settings and manifest.json caching settings in webpacker.yml and no luck. I'm just out of ideas and would love to hear any thoughts you had on getting it going. Thanks for your work in creating this, and any ideas you might have about getting through this issue.

[nning]

Hi! I'm happy, you're trying it out!

The rails svelte:install task should have added the dependency on svelte_ujs_ng to package.json and it should be present in yarn.lock. Do you run a current version of yarn?

The exports property in package.json should make it possible to rewrite the root of the lib to the subfolder. So this did also not work in development for you? I found this issue about support for the exports property in webpack >= 5 but I also tried with webpacker 4.2 and webpack 4.43 and it worked. Which version of node are you using (in development and in production)? node 12.7 seems to be minimally required; I did not know that yet and maybe that would be an useful addition to the README.

Thanks for reaching out!

[nning]

Also please make sure to update svelte-rails and svelte_ujs_ng to 0.3.4 as it fixes an issue with the import of JavaScript dependencies.

[nning]

I just tried creating a fresh demo app without webpack and then installing everything as you described but I do not run into problems (with 0.3.4). Could you provide a demo app, please?

[muchaya]

and this is the point where I get stuck. I can't find any combination of settings to get through this. I've tried changing the timeout in WaitPlugin from 30s to 300s, and it still times out. I've tried changing compile settings and manifest.json caching settings in webpacker.yml and no luck. I'm just out of ideas and would love to hear any thoughts you had on getting it going. Thanks for your work in creating this, and any ideas you might have about getting through this issue.

I am not sure if you resolved this but for me, I changed 30s to 30000s but there was still a timeout. I finally resolved it by changing the timeout to an insanely huge figure like 300000000000000 and it worked somehow.

[ryanlabouve]

In ....../webpack/environment.js I had to change

-const getSvelteEnvironments = require('svelte_ujs_ng/getSvelteEnvironments')
+const getSvelteEnvironments = require('svelte_ujs_ng/svelte_ujs/getSvelteEnvironments')

Otherwise I got MODULE_NOT_FOUND

[wyozi]

I feel like there's some kind of data race issue happening with the timeout. I used to get the same timeout error but rerunning asset precompilation a few times fixed it. Now that I made the codebase a bit more complex though, I keep getting the timeout (Waited too long for "manifest.json" to exist.) error no matter how many times I run it.

e: actually this could also imply that the timeout is just too short, which is why it keeps failing for me in a low-memory server setting and works fine on the relatively beefy macbook

[wyozi]

Yeah, this seems to be pretty much related to the environment where the compilation is happening being too slow to finish in the timeout.

I'm using this workaround to lift the timeout without having to pull the whole codebase:

const WaitPlugin = require('svelte_ujs_ng/WaitPlugin');

const envs = getSvelteEnvironments(clientLoader, serverLoader);
envs[1].plugins.delete("WaitPlugin");
envs[1].plugins.prepend(
  'WaitPlugin',
  new WaitPlugin('manifest.json', 200, 30000000)
);

[oneearedrabbit]

In ....../webpack/environment.js I had to change

-const getSvelteEnvironments = require('svelte_ujs_ng/getSvelteEnvironments')
+const getSvelteEnvironments = require('svelte_ujs_ng/svelte_ujs/getSvelteEnvironments')

Otherwise I got MODULE_NOT_FOUND

I'm seeing the same issue with a fresh Heroku deployment. As a temporary workaround I'm using this:

let getSvelteEnvironments
try {
  getSvelteEnvironments = require('svelte_ujs_ng/getSvelteEnvironments')
} catch(e) {
  if (e.code !== 'MODULE_NOT_FOUND') {
    throw e;
  }
  getSvelteEnvironments = require('svelte_ujs_ng/svelte_ujs/getSvelteEnvironments')
}

I'll take another look in 2021 to figure out what's happening with the dependencies.