Mohamed Ramy3

يظهر لي هذا الخطأ عند محاوله استدعاء البيانات import React from "react"; import MemesData from "../MemesData"; import logoimg from "../R.png" import one from "../one.jpg" function Form(){ const [image , setimage] = React.useState() function getimg(){ const memesarray = MemesData.data.memes console.log(memesarray) const randomnumber = Math.floor(Math.random * memesarray.length) setimage(memesarray[randomnumber].img) } return( <div className="form"> <div className="form-inputs"> <input type={"text"} placeholder="top text"></input> <input type={"text"} placeholder="bottom text"></input> </div> <button onClick={getimg}>get a new meme image</button> <h1>{image}</h1> </div> ) } export default Form; import logoimg from "./R.png" import one from "./one.jpg" export default { data : { memes: [ { img: "./R.png", num:"88" }, { img : "./one.jpg", num :"99" } ] } }

tourism_company.zip تم حل المشكله شكرا جزيلا

مازات المشكله

module: { rules: [ { test: /\.html$/i, loader: "html-loader", }, { test: /\.(sass|css|scss)$/, use: [ {// Creates `style` nodes from JS strings loader : MiniCssExtractPlugin.loader, options:{ publicPath:'../' }, }, // Translates CSS into CommonJS "css-loader", // Compiles Sass to CSS "sass-loader", ], }, { test: /\.(png|svg|jpe?g|gif)$/, use: [ { loader: 'file-loader', options: { name: '[name].[ext]', outputPath: "images", } }, ], }, { test: /\.(svg|eot|woff|woff2|ttf)$/, use: [ { loader: 'file-loader', options: { name: '[name].[ext]', outputPath: "fonts", } }, ], }, ], }, };

لقد قمت بها

يقوم webpack بتوليد هذه الصور خارج المجلد images ولا تظهر الصوره ف المتصفح