I installed react mdl after creating my react app. I added in my html and I then added a navigation layout in App.js with importing import { Layout, Header, Navigation, Drawer, Content } from 'react-mdl';
Added import 'react-mdl/extra/material.css';
import 'react-mdl/extra/material.js'; in index.js
node version: v10.15.0
I get this error:
./node_modules/react-mdl/lib/Switch.js
Module not found: Can't resolve 'react' in 'C:\Users\Lenovo\Desktop\randomp\code\englishsoundfront\node_modules\react-mdl\lib'
Related
Anyone knows how I can import each of below function in Vue and React without an error?
Right now I am getting an error if I am importing vueFetch and reactFetch.
So if am importing vueFetch into a Vue project, I am getting an error for React that React is not defined and the same applies if I import reactFetch (Vue ref not defined).
import { vueFetch } from './composables/vue/vue-fetch';
import { reactFetch } from './composables/react/react-fetch';
export { vueFetch, reactFetch };
I am trying to make a Vue and React NPM package, but I only have one index file, and I need to import both Hook into the single index file. So I do not need to create 2 packages.
here is the link to the package: https://www.npmjs.com/package/use-lightweight-fetch
I am using that latest swiper version: swiper 8.2.4 with create-react-app.
These suggested import statements work:
import { Navigation, Pagination } from "swiper";
import { Swiper, SwiperSlide } from "swiper/react/swiper-react.js";
However I cannot get the css imports to work with any of the suggestions of import statements online.
Currently I have tried to use these three import statement but they all give me an error.
import "swiper/swiper.scss";
import 'swiper/swiper.min.css'
import 'swiper/css';
I get this error Module not found: Error: Package path ./swiper.scss is not exported from package /app/node_modules/swiper (see exports field in /app/node_modules/swiper/package.json) even though I can see that file exists and is being exported in the package.json. Any ideas on this?
I'm new to swiper and I'm currently facing problem importing these following css styles from Swiper:
import "swiper/css";
import "swiper/css/navigation";
import "swiper/css/pagination";
I'm using Swiper version 6.8.4 because of some issue with eslint. I'm also using lessjs to style my page in React. So how do I solve this Unable to resolve path to module issue
I am getting the error below
import { Home, Services, Contact} from "./containers";
every time I try to import like this
Module not found: Can't resolve './containers' in 'C:\Users\Admin\source\Project\src
however if I do the below it works without problem.
import Home from "./containers/Home/index.js";
import Servicesfrom "./containers/Servicesfrom/index.js";
import Contactfrom "./containers/Contact/index.js";
inside containers there is
Home/index.js, Servicesfrom/index.js and Contact/index.js
It would be better if there is a "index.js" file in your containers folder that exports the other components as so
index.js
import Home from "./containers/Home/index.js";
import Servicesfrom "./containers/Servicesfrom/index.js";
import Contactfrom "./containers/Contact/index.js";
export {
Home,Servicesfrom, Contactfrom
}
I am running into this error where npm start just runs fine with the follwing import :
import Header from 'semantic-ui-react/dist/commonjs/elements/Header';
But when I do a npm test, It always shows me :
ReferenceError: Header is not defined
But When I change the import in the main file to the below line the npm test runs fine
import Header from '../node_modules/semantic-ui-react/dist/commonjs/elements/Header';
Is there any alternative for me to avoid referencing the import from node_modules folder?
semantic-ui-react exports all of its components as named modules, so that you don't have to dig all the way through the various paths to get to each component. Instead, you could do:
import { Button } from 'semantic-ui-react'
import { Header } from 'semantic-ui-react'
import { Container } from 'semantic-ui-react'
That's a lot simpler, yeah? 😊 And, in case semantic-ui-react changes their folder structure, you won't have to change your code.
Here is the semantic-ui-react documentation on how to import and use its components. Just click on the "Try it" icon for any of the examples.