React错误：使用Webpack时单词未知

Question

我已经用webpack和babel建立了一个React环境。 但是，当我运行webpack-dev-server --progress --colors ，出现如下错误：

ERROR in multi (webpack)-dev-server/client?http://localhost:8080 E:/src/index.js

Module not found: Error: can't resolve 'E:\src/index.js' in 'E:\personal_projects\web-site-name'

...

(2:1) Unknown word

1: var url = require("url");
   ^

我的webpack.config.js文件是这样的：

var webpack = require('webpack');
var path = require('path');

var BUILD_DIR = path.resolve(__dirname, '/public');
var APP_DIR = path.resolve(__dirname, '/src');

var config = {
  entry: APP_DIR + '/index.js',
  output: {
    path: BUILD_DIR,
    filename: 'bundle.js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['env']
          }
        }
      },
      {
        test: /(\.css$)/,
        loaders: ['style-loader', 'css-loader', 'postcss-loader']
      },
      {
        loader: 'postcss-loader',
        options: {
          plugins: () => [require('autoprefixer')]
        }
      }
    ]
  }
};

module.exports = config;

我认为babel有一些问题，它会将我的index.js编译到我的bundle.js文件中。 有什么建议吗？

Answer 1

您需要使用path.join或删除斜杠，例如

path.resolve(__dirname, '/src');

和其他行使用resolve应该是

path.resolve(__dirname, 'src');

要么

path.join(__dirname, 'src');

甚至

path.join(__dirname, '/src');

您对.resolve使用将传递一个绝对路径/src ，这意味着第一个参数实际上已被丢弃。