Closed
Description
I am using Windows 10 OS, running a project using parcel@latest and yarn init -2 and deploying the project to Netlify. My challenge is that I cannot use react-netlify-identity library for Identity strategy. The code crashes with the above stated error.
Code
package.js
{
"name": "kubuka-sub",
"packageManager": "[email protected]",
"private": true,
"source": "public/index.html",
"scripts": {
"start": "parcel --https --open --port 7420",
"build": "parcel build"
},
"devDependencies": {
"@parcel/compressor-brotli": "^2.5.0",
"@parcel/compressor-gzip": "^2.5.0",
"@parcel/config-default": "^2.5.0",
"@parcel/core": "^2.5.0",
"@parcel/resolver-default": "^2.5.0",
"@parcel/transformer-raw": "^2.5.0",
"@parcel/transformer-svg-react": "^2.5.0",
"@tailwindcss/aspect-ratio": "^0.4.0",
"@tailwindcss/forms": "^0.5.2",
"@tailwindcss/line-clamp": "^0.4.0",
"parcel": "^2.5.0",
"postcss": "^8.4.14",
"tailwindcss": "^3.0.24"
},
"dependencies": {
"@emotion/css": "^11.9.0",
"@emotion/react": "^11.9.0",
"@fortawesome/fontawesome-free": "^6.1.1",
"@headlessui/react": "^1.6.2",
"@heroicons/react": "^1.0.6",
"faunadb": "^4.5.4",
"formik": "^2.2.9",
"gotrue-js": "^0.9.29",
"is-hotkey": "^0.2.0",
"process": "^0.11.10",
"react": "17",
"react-dom": "17",
"react-netlify-identity": "^0.2.5",
"react-router-dom": "^6.3.0",
"rxjs": "^7.5.5",
"slate": "^0.78.0",
"slate-history": "^0.66.0",
"slate-react": "^0.79.0",
"web-vitals": "^2.1.4",
"yup": "^0.32.11"
},
"alias": {
"process": {
"global": "process"
}
},
"browserslist": "> 0.5%, not op_mini all, not ie 11, not ios_saf < 13"
}
index.html
<!DOCTYPE html>
<html lang="en" class="h-full bg-gray-50">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
<title>Kubuka Space PBC - Scouting the hidden genius</title>
</head>
<body class="h-full">
<div id="root"></div>
<script type="module" src="../src/index.js"></script>
</body>
</html>
tailwind.config.js
module.exports = {
content: [
"./src/**/*.{html,js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
plugins: [
require('@tailwindcss/forms'),
require('@tailwindcss/aspect-ratio'),
require('@tailwindcss/line-clamp'),
],
}
.postcssrc
{
"plugins": {
"tailwindcss": {}
},
"extends": "@parcel/config-default",
"resolvers": ["@company/parcel-resolver", "..."]
}
.parcelrc
{
"extends": "@parcel/config-default",
"transformers": {
"*.svg": ["...", "@parcel/transformer-svg-react"],
"*.{zip,tgz,mp4,png,jpeg,jpg,mp3}": ["@parcel/transformer-raw"]
}
}
ContextProvider.js
import { useEffect, useState, createContext, useContext } from 'react';
import { useParams } from 'react-router-dom';
import { useNetlifyIdentity } from "react-netlify-identity";
const ApiContext = createContext();
export const ContextProvider = ({ children }) => {
const [url] = useState("https://www.mysitelinkmain.com");
const identity = useNetlifyIdentity(url);
return (
<ApiContext.Provider value={identity}>
{children}
</ApiContext.Provider>
);
};
export const useCtx = () => {
return useContext(ApiContext);
};
How it is behaving
- yarn init -2 - Successful
- yarn install - Successful
- yarn start - xBuild failed =>
× Build failed.
@parcel/core: Failed to resolve 'react-netlify-identity' from './src/.../context/index.js'
C:\Users\...\src\components\context\index.js:3:36
2 | import { useParams } from 'react-router-dom';
> 3 | import { useNetlifyIdentity } from "react-netlify-identity";
> | ^^^^^^^^^^^^^^^^^^^^^^^^
@parcel/resolver-default: Could not load './dist/react-netlify-identity.es.production.js' from module
'react-netlify-identity' found in package.json#module
C:\Users\...\.yarn\__virtual__\react-netlify-identity-virtual-92217ec8e4\0\cache\react-netlify-identity-npm-0.2.5-e3363cde5b-8b31bb74f9.zip\node_modules\react-netlify-identity\package.json:10:13
9 | "umd:main": "dist/react-netlify-identity.umd.production.js",
> 10 | "module": "dist/react-netlify-identity.es.production.js",
> | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ './dist/react-netlify-identity.es.production.js' does not exist, did you mean './dist/react-netlify-identity.cjs.production.min.js'?'
11 | "typings": "dist/index.d.ts",
12 | "jsnext:main": "dist/index.es.js",
I hope this is not too long. It's my first time to post an error so I don't know the standard way of doing it or whether there are templates used.
Thank you
Metadata
Metadata
Assignees
Labels
No labels