[BUG] Error on build with Webpack plugin after installing some package

[bramaudi]

Bug Report Quick Checklist

• [x] I am on the latest version of Snowpack & all plugins.
• [x] I use package manager NPM (v7.5.6).
• [x] I run Snowpack on OS Linux (Ubuntu 20.04.2 LTS).
• [x] I run Snowpack on Node.js v12+

Describe the bug

Error on build after installing these packages:

npm install -D tailwindcss@latest postcss@latest autoprefixer@latest

The error log: https://pastebin.com/5dcVFfPJ

To Reproduce

1. git clone https://github.com/bramaudi/snowpack-solid-template project
2. cd project && npm i
3. npm run build - this still build successfully of course
4. npm install -D tailwindcss@latest postcss@latest autoprefixer@latest
5. See error!

Expected behavior

Webpack successfuly build the production bundle.

Anything else?

After deleting those package by doing npm r tailwindcss postcss autoprefixer the error still present, even when deleting the node_modules dir using rm -rf node_modules and re-installing packages will give no effect.

The only way to get back is clear the project folder then git reset --hard the latest commit / re-clone it. I have no idea to solve it, i mean without doing more configuration.

[denovodavid]

It seems there's some incompatibility going on with caniuse-lite > 1.0.30001195 and browserslist/babel/core-js/something else idk. Through some trial and error, I've found it's not processing the latest JS syntax very well.

I've outlined some steps to demonstrate this, and a workaround using Yarn.

1. yarn create snowpack-app project --template @snowpack/app-template-blank --use-yarn
2. cd project
3. yarn add --dev @snowpack/plugin-webpack - then add @snowpack/plugin-webpack to plugin list in snowpack.config.js
4. yarn build - Success
5. Add some new JavaScript syntax:

   
   // src/index.js

// ES2020 nullish coalescing function greet(input) { return input ?? "Hello world"; }

7. `yarn build` - Fail
8. Using **Yarn**, you can force `caniuse-lite` to a specific version using the `resolutions` field in `package.json`:
```json
"resolutions": {
    "caniuse-lite": "1.0.30001195"
}

9. yarn install
10. yarn build - Success

I don't understand why this is the case, but I hope someone can debug this, it's over my head.

[bramaudi]

Thanks for your response @denovodavid It seems you're right, maybe my previous dependencies causing a conflict with the new one especially affected the dependencies of snowpack webpack-plugin.

For information, i have try this from new blank snowpack project and its works great!

[ShivamJoker]

"resolutions": {
    "caniuse-lite": "1.0.30001195"
}

Adding this in package.json fixed the issue

[ShivamJoker]

@bramaudi should not this be resolved by snowpack itself rather than us modifying package.json

[bramaudi]

Ah yes, sure!