找不到模块：错误：无法解析'core-js / fn / array'React Webpack

编程问答 2022-06-10

问题描述

我将CollectionPage的组件更改为箭头函数组件，而不是普通函数，然后出现此错误，但是我不知道为什么当我对许多其他组件执行相同操作时，它没有引发此错误。 这是通用代码

import { from } from 'core-js/fn/array'
import React from 'react'
import { useParams } from 'react-router-dom'
import Products from '../Products/Products'
import {H1} from '../../Style/global'

const CollectionPage=()=> {
    const {collectionTitle}= useParams()
    return (
        <div style={{marginTop:96}}>
            <H1>{collectionTitle} Collection</H1>
            <Products collectionTitle={collectionTitle}/>
        </div>
    )
}


export default CollectionPage

这是一个React Webpack项目，这是我的Webpack配置：

const path = require('path')
const HTMLPlugin = require('html-webpack-plugin')
const copyPlugin = require('copy-webpack-plugin');

module.exports ={
    entry :"./src/index.js",output:{
        path:path.resolve(__dirname,"./dist"),filename:'index.js',},plugins:[
        new HTMLPlugin({template:'./src/index.html'}),new copyPlugin({
            patterns: [
              { from: './src/images',to: 'images' },],}),module:{
        rules:[
            { 
                test : /\.js$/,exclude:/node_modules/,use:{
                    loader:"babel-loader"
                },{
                test: /\.(png|gif|jpg)$/,include: [
                  path.join(__dirname,'./src/images')
                ],loader: 'file-loader',{
                test:/.(png|jpg|woff|woff2|eot|ttf|svg|gif)$/,//Customise according to your need
                use: [
                  {
                    loader: 'url-loader',options: {
                      limit: 100000000,}
                  }
               ]
            },{
                test: /\.js$/,enforce: 'pre',use: ['source-map-loader'],{
                test: /\.css$/i,loader: 'style-loader!css-loader' 
            },]
    }
}

这是错误：

./ src / components / routes / CollectionPage.js找不到模块：错误： 无法在'C：\ Users \ Ora中解析'core-js / fn / array' Ora \ l-3afya-mafya-merch-store-react-js- \ src \ components \ routes'

也收到此错误

来自chokidar的错误（C：\ node_modules）：错误：EBUSY：资源繁忙或 chokidar锁定了lstat'C：\ DumpStack.log.tmp'错误 （C：\ node_modules）：错误：EBUSY：资源繁忙或锁定，lstat chokidar（C：\ node_modules）出现'C：\ hiberfil.sys'错误：错误：忙： 资源忙碌或锁定，lstat'C：\ pagefile.sys'来自chokidar的错误 （C：\ node_modules）：错误：EBUSY：资源繁忙或锁定，lstat chokidar（C：\ node_modules）出现'C：\ swapfile.sys'错误：错误：忙： 资源繁忙或锁定，lstat'C：\ DumpStack.log.tmp'错误来自 chokidar（C：\ node_modules）：错误：EBUSY：资源繁忙或锁定， 来自chokidar的lstat'C：\ hiberfil.sys'错误（C：\ node_modules）：错误： 繁忙：资源繁忙或锁定，lstat'C：\ pagefile.sys'错误来自 chokidar（C：\ node_modules）：错误：EBUSY：资源繁忙或锁定， lstat'C：\ swapfile.sys'

解决方法

感谢Jacobo Tapia的评论，我意识到这是一个愚蠢的Visual Studio自动导入错误，因为您可以在组件顶部看到此导入import { from } from 'core-js/fn/array'，这毫无意义

core-jsreactjsreactjsreactjsreactjswebpackwebpackwebpack