Question

我正在尝试导入“Cheerio.js”以进行网络抓取。当我尝试运行它。我得到“模块解析失败错误：您可能需要一个适当的加载器来处理此文件类型。”看来我必须在我的webpack.config.js中安装额外的加载器或更改我的配置，但我很难尝试解决这个问题。有谁可以帮我解决这个问题？

以下是我收到的错误：

ERROR in ./~/har-schema/lib/log.json
Module parse failed: /Users/taelee/Desktop/reactReduxBoilerPlate/ReduxSimpleStarter/node_modules/har-schema/lib/log.json Unexpected token (2:7)
You may need an appropriate loader to handle this file type.

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

module.exports = {
  entry: [
    './src/index.js'
  ],
  output: {
    path: __dirname,
    publicPath: '/',
    filename: 'bundle.js'
  },
  module: {
    loaders: [{
      exclude: /node_modules/,
      loader: 'babel',
      query: {
        presets: ['react', 'es2015', 'stage-1', 'stage-0']
      }
    }]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  devServer: {
    historyApiFallback: true,
    contentBase: './'
  }
};

这是我的package.json文件：

{
  "name": "redux-simple-starter",
  "version": "1.0.0",
  "description": "Simple starter package for Redux with React and Babel support",
  "main": "index.js",
  "repository": "git@github.com:StephenGrider/ReduxSimpleStarter.git",
  "scripts": {
    "start": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js",
    "test": "mocha --compilers js:babel-core/register --require ./test/test_helper.js --recursive ./test",
    "test:watch": "npm run test -- --watch"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.2.1",
    "babel-loader": "^6.2.0",
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-react": "^6.1.18",
    "chai": "^3.5.0",
    "chai-jquery": "^2.0.0",
    "jquery": "^2.2.1",
    "jsdom": "^8.1.0",
    "mocha": "^2.4.5",
    "react-addons-test-utils": "^0.14.7",
    "webpack": "^1.12.9",
    "webpack-dev-server": "^1.14.0"
  },
  "dependencies": {
    "axios": "^0.17.1",
    "babel-preset-stage-1": "^6.1.18",
    "cheerio": "^1.0.0-rc.2",
    "jsonp": "^0.2.1",
    "lodash": "^3.10.1",
    "moment": "^2.19.2",
    "prop-types": "^15.6.0",
    "react": "^0.14.3",
    "react-ace": "^5.10.0",
    "react-ace-editor": "0.0.2",
    "react-dom": "^0.14.3",
    "react-redux": "4.3.0",
    "react-router": "^2.0.1",
    "react-router-redux": "^4.0.8",
    "redux": "^3.0.4",
    "redux-promise": "^0.5.3",
    "request": "^2.85.0",
    "request-promise": "^4.2.2"
  }
}

有人可以帮我解决这个问题吗？

谢谢。

Answer 1

试试这个： 1）configuration.resolve.extensions[0]不应为空 2）使用loader: 'babel-loader'，确保安装了babel-loader

module.exports = {
context: `${__dirname}/src`,
entry: [
    './index.js'
],
output: {
    path: __dirname,
    publicPath: '/',
    filename: 'bundle.js'
},
module: {
    loaders: [{
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
            presets: ['react', 'es2015']
        }
    }]
},
resolve: {
    extensions: ['.js', '.jsx']
},
devServer: {
    historyApiFallback: true,
    contentBase: './'
}

};

React - 如何解决模块解析失败错误：您可能需要一个适当的加载器来处理此文件类型

1 个答案: