Closed paddymul closed 1 month ago
paddymul
commented
1 month ago I updated my branch ( 1e7cfa0effef ). now you can just run
yarn webpack --config ./webpack.config.js --mode=development
and you get this error
asset index.js 99 bytes [compared for emit] (name: main)
ERROR in Invalid value used in weak set
webpack 5.91.0 compiled with 1 error in 26 ms
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
alexander-akait
commented
1 month ago The problem is here - https://github.com/paddymul/buckaroo/blob/chore/fix-codepen/webpack.config.js#L61, you are using the mini-css-extract-plugin plugin as the resolver plugin, but it is just a regular plugin
Here how to fix:
const path = require('path');
const version = require('./package.json').version;
//import {TsconfigPathsPlugin} from 'tsconfig-paths-webpack-plugin';
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
//import HtmlWebpackPlugin from 'html-webpack-plugin';
const HtmlWebpackPlugin = require('html-webpack-plugin');
const luminoThemeImages = /^.*@lumino\/default-theme.*.png$/;
const crypto = require('crypto');
// Workaround for loaders using "md4" by default, which is not supported in FIPS-compliant OpenSSL
const cryptoOrigCreateHash = crypto.createHash;
crypto.createHash = (algorithm) =>
cryptoOrigCreateHash(algorithm == 'md4' ? 'sha256' : algorithm);
const performance = {
maxAssetSize: 100_000_000,
};
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const devMode = process.env.NODE_ENV !== 'production';
// Custom webpack rules
const rules = [
{ test: /\.tsx?$/, loader: 'ts-loader' },
{ test: /\.js$/, loader: 'source-map-loader' },
{ test: /\.css$/, use: ['style-loader', 'css-loader'] },
{
test: luminoThemeImages,
issuer: /\.css$/,
use: {
loader: 'url-loader',
},
},
{
test: /\.(jpg|png|gif|woff|woff2)$/,
exclude: luminoThemeImages,
use: ['file-loader'],
},
{
test: /\.md$/,
use: ['html-loader', 'markdown-loader'],
},
{
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
issuer: /\.css$/,
use: {
loader: 'svg-url-loader',
options: { encoding: 'none', limit: 10000 },
},
},
];
// Packages that shouldn't be bundled but loaded at runtime
const externals = ['@jupyter-widgets/base'];
const resolve = {
// Add '.ts' and '.tsx' as resolvable extensions.
extensions: ['.webpack.js', '.web.js', '.ts', '.js', '.tsx'],
plugins: [new TsconfigPathsPlugin()],
fallback: { crypto: false },
};
module.exports = [
/**
* Embeddable buckaroo bundle
*
* This bundle is almost identical to the notebook extension bundle. The only
* difference is in the configuration of the webpack public path for the
* static assets.
*
* The target bundle is always `dist/index.js`, which is the path required by
* the custom widget embedder.
*/
{
entry: './js/index.ts',
output: {
filename: 'index.js',
path: path.resolve(__dirname, 'dist'),
libraryTarget: 'amd',
library: 'buckaroo',
publicPath: 'https://unpkg.com/buckaroo@' + version + '/dist/',
},
devtool: 'source-map',
module: {
rules: rules,
},
plugins: [
new MiniCssExtractPlugin()
],
externals,
resolve,
devServer: {
port: 8030,
},
performance,
},
];Feel free to feedback
Bug report
I get an
ERROR in Invalid value used in weak setwhen runningnpm run buildI have looked at the previous bug reports related to this error, and all were tied in some way to webpack v4. even after updating to webpack v5, I see the same
weak seterror.Actual Behavior
Expected Behavior
Here is a shell output from running build
How Do We Reproduce?
Note this is a relatively complex project that builds a jupyterlab extension with typescript and react. jupyterlab uses module federation. I don't think that is the source of the problem
How I got here
My build works on main, but I'm currently trying to tweak my build so that the npm module works as a standalone in codepen. The project has a whole interactive docs section https://buckaroo-data.readthedocs.io/en/latest/examples/#/DFViewerEx_large that I have been updating.
The edit on codepen buton fails in docs fail because skypack.dev can't import the css file from main. I am trying to fix that bug. I am also experimenting with jsdelivr and esm.sh
My branch where I'm trying to make this work is here: https://github.com/paddymul/buckaroo/pull/294
Please paste the results of
npx webpack-cli infohere, and mention other relevant informationHere are the results from
webpack-cli info