You may need an appropriate loader to handle this file type with react@15.4.2, webpack@2.2.1 and babel-loader@6.2.10

Webpack Version: 2.2.1

Babel Core Version: 6.22.1

Babel Loader Version: 6.2.10

Please tell us about your environment: Linux

Current behavior: it gives an error You may need an appropriate loader to handle this file type with

Expected/desired behavior: no error

  //package.json
  "babel-core": "^6.22.1",
  "babel-loader": "^6.2.10",
  "babel-preset-es2015": "^6.22.0",
  "babel-preset-react": "^6.22.0",
  "css-loader": "^0.26.1",
  "extract-text-webpack-plugin": "^2.0.0-rc.2",
  "html-webpack-plugin": "^2.28.0",
  "node-sass": "^4.5.0",
  "react": "^15.4.2",
  "react-dom": "^15.4.2",
  "sass-loader": "^4.1.1",
  "style-loader": "^0.13.1",
  "uglifyjs-webpack-plugin": "^0.1.2",
  "webpack": "^2.2.1"

//webpack.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin'),
      UglifyJSPlugin = require('uglifyjs-webpack-plugin'),
      ExtractTextPlugin = require("extract-text-webpack-plugin"),
      path = require("path");

module.exports = {
  "entry": ["./app/index.js"],
  "output": {
    "path": "output",
    "filename": "[name]-[chunkhash].js",
    "libraryTarget": "umd"
  },
  "module": {
    rules: [
      {
        "exclude": "/node_modules/",
        "include": "./app/",
        "loader": "babel-loader",
        "options": {
          "presets": ["es2015", "react"]
        },
        "test": /\.jsx?$/
      },
      {
        "exclude": "/node_modules/",
        "use": ExtractTextPlugin.extract({
          "fallbackLoader": "style-loader",
          "loader": ["css-loader", "sass-loader"]
        }),
        "test": /\.scss$/
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin(),
    new ExtractTextPlugin("[name]-[contenthash].css")
  ]
}

//./app/index.js
let React = require("react"),
    ReactDom = require("react-dom");

ReactDom.render(
  <div id="root"></div>,
  document.getElementsByTagName("body")
);

[loganfsmyth]

If I had to guess, you want

        "exclude": "/node_modules/",
        "include": "./app/",

to be

        "include": __dirname + "/app/",

or

        "exclude": /node_modules/,

paths have to be absolute paths, or regexes.

[Couto]

@Bijayini Your test values are a string value, which means they won’t match during the test resolution. You can switch to:

  {test: /\.js$/ , loader:'babel-loader', exclude: '/node_modules/'},
  {test: /\.jsx$/ , loader:'babel-loader', exclude: '/node_modules/'}