importing the library in react js project
mehrdadtorki opened this issue · 1 comments
Hello dear sir.
i make a sample project to use your library
this is my App.js
import { ApolloClient, ApolloProvider, InMemoryCache } from '@apollo/client';
import createUploadLink from 'apollo-upload-client/createUploadLink.mjs';
import UploadFile from './pages/AppoloTest';
const client = new ApolloClient({
link: createUploadLink({
uri: 'http://localhost:4444/graphql'
}),
cache: new InMemoryCache(),
});
function App() {
return (
<div className="App">
<ApolloProvider client={client}>
<UploadFile />
</ApolloProvider>
</div>
);
}
export default App;
and this is my UploadFile.js
import { gql, useMutation } from "@apollo/client";
const MUTATION = gql`
mutation ($file: Upload!) {
uploadFile(file: $file) {
success
}
}
`;
function UploadFile() {
const [mutate] = useMutation(MUTATION);
return (
<input
type="file"
required
onChange={({
target: {
validity,
files: [file],
},
}) => {
const b = new Blob([file], { type: file.type })
if (validity.valid)
mutate({
variables: {
file: b,
},
});
}}
/>
);
}
export default UploadFile;
and i change multiple time rho formation of my import and finaly the createUploadLink being correct but now i got this error
export 'default' (imported as 'isExtractableFile') was not found in './isExtractableFile.mjs' (module has no exports)
I'm assuming you're using the latest version of apollo-upload-client
.
Most likely your bundler is misconfigured somehow and it's not correctly bundling this import:
apollo-upload-client/createUploadLink.mjs
Line 18 in 5e6d5c1
Which is re-exporting this module:
Make sure that you are using a modern bundler and that it's configured correctly to resolve modules according to how Node.js ESM work, so .mjs
file extensions etc.
Closing because this is not something I can fix here in apollo-upload-client
, it relates to your project tooling.