snowpack-react-ssr icon indicating copy to clipboard operation
snowpack-react-ssr copied to clipboard

Importing css causes unexpected token on production build

Open alexknipfer opened this issue 4 years ago • 1 comments

Thanks for sharing this, was playing around with your example, any ideas as to why if you import a css file into a component file it causes an unexpected token error?

Steps to repro:

1.) In your App.jsx file, import your css file with import './index.css'

2.) npm run build

3.) npm run production

4.) The following error occurs:

.App-logo {
^

SyntaxError: Unexpected token '.'
    at wrapSafe (internal/modules/cjs/loader.js:979:16)
    at Module._compile (internal/modules/cjs/loader.js:1027:27)
    at Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Object.newLoader [as .js] (/Users/alexanderknipfer/Projects/snowpack-react-ssr/node_modules/pirates/lib/index.js:104:7)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (/Users/alexanderknipfer/Projects/snowpack-react-ssr/src/App.jsx:4:1)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)

alexknipfer avatar Feb 02 '21 02:02 alexknipfer

Hey, thanks for pointing this out. I can reproduce it, and I'm aware that styles don't work via imports. I'll see if I can get this fix into future versions.

Since this is SSR focused I opted to inline critical styles (via the critical.css) file.

matthoffner avatar Feb 05 '21 03:02 matthoffner