graphql-playground
graphql-playground copied to clipboard
Error when compiling in Angular 12 application - ./node_modules/graphql-playground-react/lib/assets/logo.png:1:0 - Error: Module parse failed: Unexpected character '�' (1:0) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders (Source code omitted for this binary file)
This issue pertains to the following package(s):
- [x ] GraphQL Playground HTML
What OS and OS version are you experiencing the issue(s) on? Windows
What version of graphql-playground(-electron/-middleware) are you experiencing the issue(s) on? 1.7.27
What is the expected behavior? - Compile succeeds
What is the actual behavior? - Compile fails with error
./node_modules/graphql-playground-react/lib/assets/logo.png:1:0 - Error: Module parse failed: Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
What steps may we take to reproduce the behavior? - Compile an angular 12 project with graphql-playground as a dependency.
Please provide a gif or image of the issue for a quicker response/fix.
+1
hello same issue @MurrayFurtado have you a solution ?
This issue also makes it impossible to use graphql-playground-react
with importmap
One way to fix it would be to compile import imageSource from '../assets/logo.png'
(here) down to inline data.
Currently, in the npm package, it's compiled to var logo_png_1 = require("../assets/logo.png");
which leaves down to the user to inline the image. That works fine when user code goes through webpack/esbuild/etc., but jspm doesn't work that way. It doesn't allow any code transformations - it's simpy following imports.