找不到入口模块和Webpack中的错误

问题描述 投票:2回答:1

我是JavaScript的新手,请按照Github上的清晰节点教程进行操作。但是无论我在所有模块中尝试过什么,当我运行yarn dev:wds

时,都会不断收到此错误消息。
    ERROR in Entry module not found: Error: Can't resolve './src' in 'C:\Users\Renate\projects'     
    ERROR in multi (webpack)-dev-server/client?http://localhost:8080 ./src Module not found: 
    Error: Can't resolve './src'  in 'C:\Users\Renate\projects'  @ multi (webpack)-dev- 
    server/client?http://localhost:8

我已经尝试过此solution,但是重新安装babel-loader 7并不能解决我的问题。我也尝试过重新安装整个webpack-module,但这也不能解决我的问题。

我的webpack.config.babel.js文件:

// @flow

import path from 'path'
import webpack from 'webpack'

import { WDS_PORT } from './src/shared/config'
import { isProd } from './src/shared/util'

export default {
  entry: [
    'react-hot-loader/patch',
    './src/client',
  ],
  output: {
    filename: 'js/bundle.js',
    path: path.resolve(__dirname, 'dist/'),
    publicPath: isProd ? '/static/' : `http://localhost:${WDS_PORT}/dist/`,
  },
  module: {
    rules: [
      { test: /\.(js|jsx)$/, use: 'babel-loader', exclude: /node_modules/ },
    ],
  },
  devtool: isProd ? false : 'source-map',
  resolve: {
    extensions: ['.js', '.jsx'],
  },
  devServer: {
    port: WDS_PORT,
    hot: true,
    headers: {
      'Access-Control-Allow-Origin': '*',
    },
  },
  plugins: [
    new webpack.optimize.OccurrenceOrderPlugin(),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NamedModulesPlugin(),
    new webpack.NoEmitOnErrorsPlugin(),
  ],
}

我的babelrc.json文件:

{
  "presets": [
    "env",
    "flow",
    "react"
  ],
  "plugins": [
    "flow-react-proptypes"
  ]
}

我的package.json文件

{
  "name": "your-project",
  "version": "1.0.0",
  "license": "MIT",
  "browserslist": [
    "> 1%"
  ],
  "scripts": {
    "start": "yarn dev:start",
    "dev:start": "nodemon -e js,jsx --ignore lib --ignore dist --exec babel-node src/server",
    "dev:wds": "webpack-dev-server --progress",
    "prod:build": "rimraf lib dist && babel src -d lib --ignore .test.js && cross-env NODE_ENV=production webpack -p --progress",
    "prod:start": "cross-env NODE_ENV=production pm2 start lib/server && pm2 logs",
    "prod:stop": "pm2 delete server",
    "lint": "eslint src webpack.config.babel.js",
    "test": "yarn lint && flow && jest --coverage",
    "precommit": "yarn test",
    "prepush": "yarn test && yarn prod:build"
  },
  "dependencies": {
    "babel-polyfill": "^6.26.0",
    "compression": "^1.7.4",
    "express": "^4.17.1",
    "immutable": "4.0.0-rc.2",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-hot-loader": "^4.5.3",
    "react-redux": "^7.1.3",
    "redux": "^4.0.5",
    "redux-actions": "^2.6.5"
  },
  "devDependencies": {
    "@babel/core": "^7.8.4",
    "@babel/node": "^7.8.4",
    "@babel/preset-env": "^7.8.4",
    "@babel/preset-flow": "^7.8.3",
    "@babel/preset-react": "^7.8.3",
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.3",
    "babel-eslint": "^10.0.3",
    "babel-jest": "^25.1.0",
    "babel-loader": "7",
    "babel-plugin-flow-react-proptypes": "^25.1.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-flow": "^6.23.0",
    "babel-preset-react": "^6.24.1",
    "cross-env": "^7.0.0",
    "eslint": "^6.8.0",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-plugin-compat": "^3.5.1",
    "eslint-plugin-flowtype": "^4.6.0",
    "eslint-plugin-import": "2.18.2",
    "eslint-plugin-jsx-a11y": "6.2.3",
    "eslint-plugin-react": "^7.18.3",
    "eslint-plugin-react-hooks": "1.7.0",
    "flow-bin": "^0.118.0",
    "husky": "^4.2.1",
    "jest": "^25.1.0",
    "nodemon": "^2.0.2",
    "pm2": "^4.2.3",
    "rimraf": "^3.0.2",
    "webpack": "^4.41.6",
    "webpack-babel-env-deps": "^1.6.3",
    "webpack-cli": "^3.3.10",
    "webpack-dev-server": "^3.10.3"
  },
  "type": "module"
}

我的eslintrc.json文件

  
{
  "extends": [
    "airbnb",
    "plugin:flowtype/recommended"
  ],
  "plugins": [
    "flowtype",
    "compat"
  ],
  "env": {
    "browser": true,
    "jest": true
  },
  "rules": {
    "semi": [2, "never"],
    "no-unexpected-multiline": 2,
    "compat/compat": 2,
    "linebreak-style": [2, "windows"]
  },
  "parser": "babel-eslint"
}

供参考,请在此处找到我的文件夹结构的附件快照。

folder structure

并且如果您查看此Github页面或this,您会发现还有更多的问题相同,但到目前为止,没有解决方案对我有用。希望你能帮助我!

更新

我也尝试过亚历克斯(Alex)的建议(请参见下面的答案),但没有用。

    ...
    entry: [
       'react-hot-loader/patch',
       path.resolve(__dirname, './src/client')
       ],

    ...
javascript node.js babel webpack-dev-server src
1个回答
1
投票

只是一个建议:您是否曾尝试解决有问题的路径,然后再将其传递到webpack?大致思路是:path.resolve(__dirname, './src/client')会将路径从相对转换为绝对,并且通常可以使各种装载机静音。

...
  entry: [
    'react-hot-loader/patch',
    path.resolve(__dirname, './src/client'),
  ],

...
© www.soinside.com 2019 - 2024. All rights reserved.