Skip to content
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

Add .js file extension to all in-project imports #10994

Merged
merged 41 commits into from
Jul 7, 2023

Conversation

phryneas
Copy link
Member

Triggered by #9890 - I'm not sure yet how to validate that this is not a breaking change in some environments. Ideas welcome.

Checklist:

  • If this PR contains changes to the library itself (not necessary for e.g. docs updates), please include a changeset (see CONTRIBUTING.md)
  • If this PR is a new feature, please reference an issue where a consensus about the design was reached (not necessary for small changes)
  • Make sure all of the significant new logic is covered by tests

@changeset-bot

This comment was marked as off-topic.

@github-actions
Copy link
Contributor

github-actions bot commented Jun 20, 2023

size-limit report 📦

Path Size
dist/apollo-client.min.cjs 36.99 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" 43.56 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" (production) 42.18 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" 32.57 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" (production) 31.43 KB (0%)
import { ApolloProvider } from "dist/react/index.js" 1.23 KB (0%)
import { ApolloProvider } from "dist/react/index.js" (production) 1.22 KB (0%)
import { useQuery } from "dist/react/index.js" 4.27 KB (0%)
import { useQuery } from "dist/react/index.js" (production) 4.09 KB (0%)
import { useLazyQuery } from "dist/react/index.js" 4.59 KB (0%)
import { useLazyQuery } from "dist/react/index.js" (production) 4.4 KB (0%)
import { useMutation } from "dist/react/index.js" 2.5 KB (0%)
import { useMutation } from "dist/react/index.js" (production) 2.49 KB (0%)
import { useSubscription } from "dist/react/index.js" 2.24 KB (0%)
import { useSubscription } from "dist/react/index.js" (production) 2.2 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js" 3.64 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js" (production) 3.05 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js" 3.84 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js" (production) 3.28 KB (0%)
import { useReadQuery } from "dist/react/index.js" 2.56 KB (0%)
import { useReadQuery } from "dist/react/index.js" (production) 2.54 KB (0%)
import { useFragment } from "dist/react/index.js" 2.05 KB (0%)
import { useFragment } from "dist/react/index.js" (production) 2 KB (0%)

@phryneas phryneas added this to the Release 3.8 milestone Jun 20, 2023
@phryneas

This comment was marked as resolved.

@github-actions

This comment was marked as resolved.

@phryneas

This comment was marked as resolved.

@github-actions
Copy link
Contributor

A new release has been made for this PR. You can install it with npm i @apollo/[email protected].

@phryneas
Copy link
Member Author

Bundling changes from a TypeScript perspective can be seen here:

AreTheTypesWrong result for @apollo/[email protected]

image

AreTheTypesWrong result for @apollo/[email protected]

image

=> we're probably not end up "perfect" without an exports field, but at least this PR gets rid of the "internal resolution error".

@phryneas phryneas changed the title [experiment] add .js file extension to all in-project imports Add .js file extension to all in-project imports Jun 23, 2023
@phryneas
Copy link
Member Author

phryneas commented Jun 23, 2023

A PR that I made over in attw (arethetypeswrong/arethetypeswrong.github.io#46) now also checks all entry points and just revealed one more wrong import, and now it seems we're as good as we can be:

I guess we should add this check to our CI once it's merged?

┌────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┬───────────────────────────────────┐
│                    │ "@apollo/client"                  │ "@apollo/client/cache"            │ "@apollo/client/core"             │ "@apollo/client/dev"              │ "@apollo/client/errors"           │ "@apollo/client/react"            │ "@apollo/client/testing"          │ "@apollo/client/utilities"        │ "@apollo/client/link/batch"       │ "@apollo/client/link/batch-http"  │ "@apollo/client/link/context"     │ "@apollo/client/link/core"        │ "@apollo/client/link/error"       │ "@apollo/client/link/http"        │ "@apollo/client/link/persisted-q… │ "@apollo/client/link/remove-type… │ "@apollo/client/link/retry"       │ "@apollo/client/link/schema"      │ "@apollo/client/link/subscriptio… │ "@apollo/client/link/utils"       │ "@apollo/client/link/ws"          │ "@apollo/client/react/components" │ "@apollo/client/react/context"    │ "@apollo/client/react/hoc"        │ "@apollo/client/react/hooks"      │ "@apollo/client/react/parser"     │ "@apollo/client/react/ssr"        │ "@apollo/client/testing/core"     │ "@apollo/client/utilities/global… │
├────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┤
│ node10             │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │
├────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┤
│ node16 (from CJS)  │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │
│                    │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │ ⚠️ ESM (dynamic import only)      │
├────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┤
│ node16 (from ESM)  │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │ 👺 Masquerading as ESM            │
├────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┼───────────────────────────────────┤
│ bundler            │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │ 🟢                                │
└────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┴───────────────────────────────────┘

(For comparison, here is the result for AC 3.7)

@phryneas
Copy link
Member Author

So we now get AreTheTypesWrong results in the Job Summary. I believe that's good enough and probably better than having yet another bot comment?

@jerelmiller
Copy link
Member

So we now get AreTheTypesWrong results in the Job Summary. I believe that's good enough and probably better than having yet another bot comment?

I'm totally fine with this. We've got a decent amount of noise with bot comments right now, so the check seems reasonable to me.

Copy link
Member

@jerelmiller jerelmiller left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will be great to land this change. Thanks for hitting this up so fast!

@@ -137,7 +163,8 @@ function prepareBundle({

export default [
...entryPoints.map(prepareBundle),
// Convert the ESM entry point to a single CJS bundle.
//.filter(x => x.input.includes("utilities")),
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
//.filter(x => x.input.includes("utilities")),

Do we need this line?

@@ -109,9 +109,12 @@ function prepareBundle({

return {
input: inputFile,
/*
external(id, parentId) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this needed anymore? I see its commented out, so perhaps we can just remove it altogether?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's quite a bunch of stuff that can be completely removed at this point - also the full postprocessDist.ts - I'm gonna do another cleanup on this :)

});
// since we have all the file extensions in the src directory now, we can
// skip that part
// and the other PR will remove the __DEV__ check, so this whole file can
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎉

@@ -137,7 +163,8 @@ function prepareBundle({

export default [
...entryPoints.map(prepareBundle),
// Convert the ESM entry point to a single CJS bundle.
//.filter(x => x.input.includes("utilities")),
// Convert the ESM entry point to a single CJS bundle.#
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
// Convert the ESM entry point to a single CJS bundle.#
// Convert the ESM entry point to a single CJS bundle.

@phryneas phryneas self-assigned this Jun 30, 2023
@phryneas
Copy link
Member Author

phryneas commented Jul 6, 2023

Differences between before this change and after can now be seen in the "Summary" tab of the "Compare Build Output" GitHub action.

Example, not necessarily the latest diff

@phryneas
Copy link
Member Author

phryneas commented Jul 7, 2023

Okay, let's get this in :)

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants