TypeError: 'ownKeys' on proxy: trap returned duplicate entries by using css-modules via postcss
Closed this issue · 1 comments
Hi!
I try to use hmr with postcss modules, but in dev mode face with error as below:
TypeError: 'ownKeys' on proxy: trap returned duplicate entries
My config:
import postcss from 'rollup-plugin-postcss'
// ...
{
// ...
plugins: [
postcss({
extract: 'styles.css', // style/styles.css // css modules
minimize: !inDevelopment,
modules: true,
}),
inDevelopment && hotcss({ // hmr
hot: true,
file: `styles.css` // 'styles.css' works too
}),
// ...
]
}
I figured out the problem is in place where we extract keys from bundle proxy:
Object.keys(bundle)
In my case the expression bundle.map(e => e.fileName)
within ownKeys
hook of Proxy returns ['main.js', 'styles.css', 'styles.css']. And - it's important! - first style.css
(under index 1) keeps final css code in source prop whereas second style.css
keeps js code as follows:
export default{"header":"style-module_header__74YkC","title":"style-module_title__Hei5S"};
But it seems that then during hotcss plugin work it'll be overriden to
window.__css_reload();
module && module.hot && module.hot.dispose(window.__css_reload);
module && module.hot && module.hot.accept(window.__css_reload);
__$RefreshCheck$__(module);
// # sourceURL=nollup-int:///src/style.css
So I am confused how to do it
Is it possible to use it togather?
It seems I confused the repository with rollup-plugin-hot-css (is easy to do because the package names are similar). So as I don't know how to delete the issue at all, I'll just close this one