adobe-webplatform / Snap.svg

The JavaScript library for modern SVG graphics.
http://snapsvg.io
Apache License 2.0
13.95k stars 1.15k forks source link

how to use this in cra project? #643

Open Kilims opened 3 years ago

Kilims commented 3 years ago

in webpack config with imports-loader@1.2.0

{
            test: require.resolve('snapsvg/dist/snap.svg.js'),
            use: 'imports-loader?this=>window,fix=>module.exports=0',
        },

not working, and saying

ValidationError: Invalid options object. Imports Loader has been initialized using an options object that does not match the API schema.
 - options should be one of these:
   object { imports, … } | object { wrapper, … } | object { additionalCode, … }
   Details:
    * options has an unknown property 'this'. These properties are valid:
      object { imports, … } | object { wrapper, … } | object { additionalCode, … }
    * options has an unknown property 'fix'. These properties are valid:
      object { imports, … } | object { wrapper, … } | object { additionalCode, … }
    * options misses the property 'imports' | should be any non-object.
    * options misses the property 'wrapper' | should be any non-object.
    * options misses the property 'additionalCode' | should be any non-object.

suppose i should modify it as following

{
            test: require.resolve('snapsvg/dist/snap.svg.js'),
            use: [
            {
                loader: 'imports-loader',
                // some config
            }
        ],
        },

but how to config it as the same as 'imports-loader?this=>window,fix=>module.exports=0' ?

sampathkumarm commented 3 years ago

Same issue with me, I tried inline as shown below but no luck. const Snap = require(imports-loader?imports=default|snapsvg|Snap&wrapper=window&!snapsvg/dist/snap.svg.js);

abid-mujtaba commented 1 year ago

This should work: https://github.com/adobe-webplatform/Snap.svg/issues/639#issuecomment-1368982744

Asphiii commented 1 year ago

This should work: #639 (comment)

I can confirm - works perfectly with Webpack 5