How to use fastboot with third-party "DOM" plugins

1

Hi, how do you deal with NPM modules that require DOM?

I’m trying to use fastboot on a website but a gallery plugin naturally fails without a DOM. I’ve seen ember-cli addons doing like this https://github.com/gmurphey/ember-masonry-grid/commit/c1cae5570d1e42285906a7fb7fae576374134a21.

Ideally I want to avoid creating (and maintaining) a wrapper addon and keep importing the plugin from NPM using ember-browserify.

What is a good way to deal with this kind of issue?

1 Like
2

This thread is old. I know. But I found it via the search tool, so I’m going to add a solution for you and future readers:

You just remove all references to the file

Think of the code that goes into the fastboot server, as serverside code. That means that no fancy animation are going to take place, no clever dom based calculations or anything like that. Obviously you’re not going to actually remove all that stuff, it’s needed for when fastboot is done and your visitors browser is taking over.

So what you do it to import vendor files only if not in fasboot. in your ember-cli-build.js file, found the root of your ember project, you can add the following:

  if (!process.env.EMBER_CLI_FASTBOOT) {
        // Place your app.import() here
  }

If any vendor scripts is acting up, you can further do

  if (vendor !== undefined) {}

And you should be good.