react import 出错，bable-loader 是安装和配置好的

Question

//Days.js

import React, {Component} from "react";
import $ from 'jquery';


class Days extends Component {

    constructor(props) {
        super(props);
        this.state = {
            data: [
                {tltle: 'ABCDE'}
            ]
        };
    }
    .....

//main.js

import React from "react";
import {render} from "react-dom";
import Days from "./Days.js";

........

e:\react06\app\main.js:1
(function (exports, require, module, __filename, __dirname) { import React from "react";
                                                              ^^^^^^

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:616:28)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Function.Module.runMain (module.js:693:10)
    at startup (bootstrap_node.js:191:16)
    at bootstrap_node.js:612:3

Days.js不报错，但是main.js 是报错的，新手，请教。

webpack.config.js

  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            "presets": [
              ["env", {
                "targets": {
                  "node": "current"
                }
              }],
              ["react"]
            ]
          }
        }
      }
    ]
  },
....
//package.json
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",

webpack 编译是通过的，但运行就报上面的错。不懂！

Answer 1

webpack配置 和 文档目录发一下

Answer 2

js没有被babel转换掉，因为import语法还在，检查一下webpack的js-loader配置

Answer 3

目录结构

webpack.config.js

const path = require('path');

module.exports = {
  entry: "./app/main.js", 

  output: {
    path: path.resolve(__dirname, "dist"), 
    filename: "all.js"
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            "presets": [
              ["env", {
                "targets": {
                  "node": "current"
                }
              }],
              ["react"]
            ]
          }
        }
      }
    ]
  },
  
  node: {
    fs: "empty",
    dgram: "empty"
  }
  
}

Answer 4

"presets": [
              ["env", {
                modules: false
              }],
              ["react"]
            ]