Build not including steal-conditional imports

[leoj3n]

Steal conditional works fine in development, but when built and deployed, the conditional modules are not included in the bundle.

lib/file-a.js:

let foo = 'aaa';
export default foo;

lib/file-b.js:

let bar = 'bbb';
export default bar;

lib/a-or-b.js:

const aOrB = System.isPlatform('window') ? 'a' : 'b';
export default aOrB;

lib/file.js:

import conditionalFile from '~/lib/file-#{~/lib/a-or-b}';
export default conditionalFile;

index.js:

import file from '~/lib/file';
console.log(file); // 'aaa' or 'bbb'

In development, this will log aaa on the client and bbb on the server.

After building with StealTools, the following error will appear on the client:

Error: 404 Not Found: https://fileapp.herokuapp.com/dist/lib/file-a.js

The module [file-app/lib/file-a] couldn't be fetched.
Clicking the link in the stack trace below takes you to the import.
See https://stealjs.com/docs/StealJS.error-messages.html#404-not-found for more information.

    at (dist/index.js:1)

Is this a bug, or do I need to somehow tell StealTools to include file-{a,b}.js during tree shake?

EDIT:

Original context: https://forums.donejs.com/t/solved-home-page-loads-fine-inner-pages-do-not-can-zone-ignore/977/8?u=leoj3n

[leoj3n]

I've created a repository to demonstrate this issue (see README for screenshots):

https://github.com/leoj3n/steal-conditional-culling-imports

The linked demo project above has these build options:

build.js: https://github.com/leoj3n/steal-conditional-culling-imports/blob/master/build.js#L3-L9

const stealTools = require('steal-tools');

const buildPromise = stealTools.build(
  {},
  {
    minify: false,
    treeShaking: false,
  }
);

Yet still file-a.js is being culled from the build, even with treeShaking set to false.

[leoj3n]

I've found a configuration option for steal and steal-tools that I didn't previously know about: bundle.

Using the bundle configuration option, I was able to get these occluded files into the build:

  "steal": {
    "bundle": [
      "~/models/file-a.js",
      "~/models/file-b.js"
    ],
    "configDependencies": [
      "./node_modules/steal-conditional/conditional"
    ]
  }

Wish I had known about the ability to manually bundle modules earlier... I guess these are the docs I needed to find:

https://stealjs.com/docs/config.bundle.html#usage-with-the-npm-plugin

I'm also having to use bundle to manually include components in the build when using the new pageComponent strategy; is this something that will perhaps be able to be communicated to steal more easily in the future? Maybe that's a separate issue.

[matthewp]

In donejs apps it should generate with ~/pages/**/ in the bundles. This means that if you put modules in the pages/ folder those will automatically be assumed to be split into bundles.

[leoj3n]

Do you know which donejs (or steal?) repo is configured to look in ~/pages/**/? I would be grateful for a link to the relevant code.

[matthewp]

The generator writes that out. https://github.com/donejs/generator-donejs/blob/master/app/index.js#L212-L213

[leoj3n]

@matthewp Ah, thanks, now I get what you mean by "donejs [generated] app". Thank you.