-
Notifications
You must be signed in to change notification settings - Fork 2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Compile error with webpack 4 #1272
Comments
I think graphql should add "browser" field in package.json since webpack4 could resolve mjs BTW, I have change configuration of webpack add following part to force webpack ignore .mjs file, this also work. But all packages will be loaded following the "main" field in package.josn resolve: { |
Thanks for the report, we'll follow up with the webpack team to understand why this isn't working as expected. |
For lazy people wanting a specific version number: downgrading to v0.13.0 fixed the issue for me. |
Hmm I'm a bit confused could you post your webpack config? |
I'm also unable to reproduce this issue. Could you post a webpack config or a github branch showing a reproducible error? Here was my attempt to reproduce: mkdir webpack-test
cd webpack-test
npm init -y
npm install --save graphql webpack webpack-cli
./node_modules/.bin/webpack-cli index.js Which prints:
I then see that |
It looks like manually supplying extensions may cause this issue - which is common for those who save their files as |
Same issue here, trying to intgrate GraphiQL into project, but fails on build... webpack version: 4.4.1 |
adding .mjs to the list of extensions worked for me after I went back and set everything back to import {} from "graphql" |
For anyone else who stumbles into this, I found the following to solve the problem by adding to rules:
and to resolve:
|
Had the same issue, but I didn't want to mess with webpack config. My fix was to change imports. -import { print } from 'graphql';
+import { print } from 'graphql/language/printer'; |
@jatsrt I didn't have to include that loader once I put |
* Fix .mjs issue with GraphQL 0.13.2 graphql/graphql-js#1272 (comment) * Fix .mjs still referencing "require" aws-amplify/amplify-js#686 (comment)
This "fix" proposed by jatsrt breaks a lot of things with, for example, antd library |
And for anyone running into this in a Quasar app, you can add the
|
can you please tell me where do i make to do these imports iam totally new on the graph ql |
* chore: fix `dendron-plugin-views` build This aim of this commit is to fix the build task within `dendron-plugin-views` package which currently results into the following error: ``` /home/nam/code/dendronhq/dendron/node_modules/zod-validation-error/node_modules/@swc/helpers/src/index.mjs Can't reexport the named export '__decorate' from non EcmaScript module (only default export is available) ``` The commit 419dec7 (PR: #3762) is responsible for this by adding a dependency which conflicts with the webpack build in `dendron-plugin-views`. That dependency uses withing its cjs build files `@swc/helpers` which conflicts with the import type from webpack. The solution is to use explicitly set [`Rule.type`](https://webpack.js.org/configuration/module/#ruletype) property which was introduced in [webpack 4.0](https://github.com/webpack/webpack/releases/tag/v4.0.0): > javascript/auto: (The default one in webpack 3) Javascript module with all module systems enabled: CommonJS, AMD, ESM > javascript/esm handles ESM more strictly compared to javascript/auto: > Imported names need to exist on imported module > Dynamic modules (non-esm, i. e. CommonJs) can only imported via default import, everything else (including namespace import) emit errors > In .mjs modules are javascript/esm by default In my understanding setting the value `javascript/auto` tells webpack that it allows for `mjs` files to be not ESM strict. This is a kind of hack and curcumvents the issue. In a proper setup `mjs` should only be handled as esm modules and nothing else. So instead of changing how webpack sees `mjs` file we might want to revert the change that introduced this issue. References - webpack/webpack#16213 (comment) * chore(internal): setup `dendron-plugin-views` build to prefer `main` entry field References - webpack/webpack#6459 (comment) - graphql/graphql-js#1272 (comment) - apollographql/apollo-link-state#302 (comment) * chore(internal): reverting to prevent increased bundle size Webpacks's treeshaking is negatively impacted by telling it to prefer `main` field instead of `module`. `module` point to esm modules which are what webpack needs to do its [treeshaking](https://webpack.js.org/guides/tree-shaking/). * chore(internal): pin version of `zod-validation-error` Intead of changing ``dendron-plugin-views` webpack build config this commits pins `zod-validation-error` to an older version within its dependency to `@swc/helpers` does not conflict with webpack rules.
|
* chore: fix `dendron-plugin-views` build This aim of this commit is to fix the build task within `dendron-plugin-views` package which currently results into the following error: ``` /home/nam/code/dendronhq/dendron/node_modules/zod-validation-error/node_modules/@swc/helpers/src/index.mjs Can't reexport the named export '__decorate' from non EcmaScript module (only default export is available) ``` The commit 419dec7 (PR: #3762) is responsible for this by adding a dependency which conflicts with the webpack build in `dendron-plugin-views`. That dependency uses withing its cjs build files `@swc/helpers` which conflicts with the import type from webpack. The solution is to use explicitly set [`Rule.type`](https://webpack.js.org/configuration/module/#ruletype) property which was introduced in [webpack 4.0](https://github.com/webpack/webpack/releases/tag/v4.0.0): > javascript/auto: (The default one in webpack 3) Javascript module with all module systems enabled: CommonJS, AMD, ESM > javascript/esm handles ESM more strictly compared to javascript/auto: > Imported names need to exist on imported module > Dynamic modules (non-esm, i. e. CommonJs) can only imported via default import, everything else (including namespace import) emit errors > In .mjs modules are javascript/esm by default In my understanding setting the value `javascript/auto` tells webpack that it allows for `mjs` files to be not ESM strict. This is a kind of hack and curcumvents the issue. In a proper setup `mjs` should only be handled as esm modules and nothing else. So instead of changing how webpack sees `mjs` file we might want to revert the change that introduced this issue. References - webpack/webpack#16213 (comment) * chore(internal): setup `dendron-plugin-views` build to prefer `main` entry field References - webpack/webpack#6459 (comment) - graphql/graphql-js#1272 (comment) - apollographql/apollo-link-state#302 (comment) * chore(internal): reverting to prevent increased bundle size Webpacks's treeshaking is negatively impacted by telling it to prefer `main` field instead of `module`. `module` point to esm modules which are what webpack needs to do its [treeshaking](https://webpack.js.org/guides/tree-shaking/). * chore(internal): pin version of `zod-validation-error` Intead of changing ``dendron-plugin-views` webpack build config this commits pins `zod-validation-error` to an older version within its dependency to `@swc/helpers` does not conflict with webpack rules.
Hi,
After updating to webpack 4, compiling graphiql doesn't work because of the graphql-js dependency.
I get a bunch of those errors:
(and a million more)
Seems like forcing the downgrade to a graphql-js version that doesn't have .mjs files fixes the issue.
The text was updated successfully, but these errors were encountered: