natemoo-re / microsite

Do more with less JavaScript. Microsite is a smarter, performance-obsessed static site generator powered by Preact and Snowpack.

Home Page:https://npm.im/microsite

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

production build fails when CSS module is imported on multiple pages

mxmul opened this issue · comments

Minimal repro

./src/pages/page-a.module.css:

.foo { color: hotpink; }

./src/pages/page-a.tsx:

import { definePage } from 'microsite/page';
import styles from './page-a.module.css';

export default definePage(() => <div class={styles.foo} />);

./src/pages/page-b.tsx (same as page-a.tsx):

import { definePage } from 'microsite/page';
import styles from './page-a.module.css';

export default definePage(() => <div class={styles.foo} />);

Expectation

This should result in a shared CSS asset that's loaded on both page-a.html and page-b.html.

Actual

$ yarn build
[snowpack] ! building source files...
[snowpack] ✔ build complete [0.02s]
[snowpack] ! installing dependencies...
[snowpack] ✔ install complete! [0.07s]
[snowpack] ! verifying build...
[snowpack] ✔ verification complete [0.00s]
[snowpack] ! writing build to disk...
[snowpack] ▶ Build Complete!


Unexpected chunk: page-a.module var modules_72970e0d = {"foo":"foo_951dd"};

export { modules_72970e0d };

node:internal/process/promises:227
          triggerUncaughtException(err, true /* fromPromise */);
          ^

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '~/app/.microsite/ssr/page-a.module.js' imported from ~/app/.microsite/ssr/pages/page-b.js
    at new NodeError (node:internal/errors:329:5)
    at finalizeResolution (node:internal/modules/esm/resolve:301:11)
    at moduleResolve (node:internal/modules/esm/resolve:736:10)
    at Loader.defaultResolve [as _resolve] (node:internal/modules/esm/resolve:847:11)
    at Loader.resolve (node:internal/modules/esm/loader:86:40)
    at Loader.getModuleJob (node:internal/modules/esm/loader:230:28)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:57:40)
    at link (node:internal/modules/esm/module_job:56:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}

note: this works fine in dev mode

Thank you for opening an issue! I'll work on a fix now, hope to get it into #94 which is waiting on a pending Snowpack release.

This is definitely a missed edge case. I will be sure to add a test for this once #104 is ready.

@mxmul I fixed this and refactored the output structure a bit. Feel free to reopen if you're still running into problems with microsite@1.1.0-next.10.

ezoic increase your site revenue