Javascript SyntaxError:意外的令牌导入。网页包配置

Javascript SyntaxError:意外的令牌导入。网页包配置,javascript,webpack,ecmascript-6,Javascript,Webpack,Ecmascript 6,我不确定如何修复由我的导入引起的这个语法错误。我认为我没有正确配置我的网页包,也不确定如何修复它 错误 package.json { "name": "jifts", "version": "1.0.0", "description": "Share, don't waste.", "main": "index.js", "scripts": { "test": "./node_modules/.bin/mocha --reporter progress app/to

我不确定如何修复由我的
导入引起的这个语法错误。我认为我没有正确配置我的网页包,也不确定如何修复它

错误

package.json

{
  "name": "jifts",
  "version": "1.0.0",
  "description": "Share, don't waste.",
  "main": "index.js",
  "scripts": {
    "test": "./node_modules/.bin/mocha --reporter progress app/tools/testSetup.js \"app/**/*.test.js\"",
    "build": "",
    "watch": "./node_modules/.bin/webpack --watch --progress",
    "start": "./node_modules/.bin/npm-run-all --parallel lint:watch",
    "lint": "./node_modules/.bin/esw webpack.config* app",
    "lint:watch": "npm run lint -- --watch"
  },
  "author": "Bradford Li",
  "license": "ISC",
  "dependencies": {
    "babel-core": "^6.25.0",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-router": "^4.1.2",
    "redux": "^3.7.2"
  },
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-cli": "^6.24.1",
    "babel-core": "^6.25.0",
    "babel-loader": "^7.1.1",
    "babel-preset-env": "^1.6.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "clean-webpack-plugin": "^0.1.16",
    "css-loader": "^0.28.4",
    "eslint": "^4.3.0",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-react": "^7.1.0",
    "eslint-watch": "^3.1.2",
    "expect": "^1.20.2",
    "file-loader": "^0.11.2",
    "html-webpack-plugin": "^2.30.1",
    "mocha": "^3.5.0",
    "npm-run-all": "^4.0.2",
    "style-loader": "^0.18.2",
    "webpack": "^3.4.1",
    "webpack-bundle-tracker": "^0.2.0",
    "webpack-dev-server": "^2.6.1"
  }
}
webpack.config

import path from 'path'
import webpack from 'webpack';
import BundleTracker from 'webpack-bundle-tracker';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import CleanWebpackPlugin from 'clean-webpack-plugin';

module.exports = {
    entry: {
        app: './app/index.js'
    },
    devtool: 'inline-source-map',
    target: 'web',
    output: {
        path: path.resolve('./app/bundles/'), // Note: Physical files will not be created during development. Files are served in memory
        filename: '[name]-[hash].js'
    },
    plugins: [
        new CleanWebpackPlugin(['./app/bundles/']),
        new HtmlWebpackPlugin({
            title: 'Output Management'
        }),
        new BundleTracker({
            filename: './webpack-stats.json'
        }),
        // allows all kinds of modules to be updated at runtime without the need for a full refresh
        new webpack.HotModuleReplacementPlugin(),
        // Keeps errors from breaking our Hot Reload experience
        new webpack.NoErrorsPlugin()

    ],
    // Tells webpack-dev-server to serve file from the app directory on localhost:8080
    devServer: {
        contentBase: './app',
        // required for HotModuleReplacement
        hot: true

    },
    module: {
        rules: [
            {test: /\.js$/, use: {loader: 'babel-loader'}},
            {test: /\.css$/, use: ['css-loader', 'style-loader']},
            {test: /\.(png|svg|jpg|gif)$/, use: ['file-loader']},
            // for fonts
            {test: /\.(woff|woff2|eot|ttf|otf)$/, use: ['file-loader']}
        ]
    }
};
B.法律改革委员会

{
  "presets": [
    [
      "env",
      {
        "targets": {
          "browsers": [
            "last 2 Firefox versions",
            "last 2 Chrome versions",
            "Firefox ESR",
            "last 3 Safari versions",
            "last 2 iOS versions",
            "ie 11"
          ]
        }
      }
    ],
    "react",
    "es2015"
  ]
}
项目结构


导入
可能无法识别,因为ES2015未通过巴贝尔进行传输。这可能与
.babelrc
的位置有关。如果
.babelrc
webpack.config.js
不在同一目录中,则必须手动移动或加载它:

{test: /\.js$/, use: {loader: 'babel-loader', options: require(/* path to babelrc */)}},

导入
可能无法识别,因为ES2015未通过巴贝尔进行传输。这可能与
.babelrc
的位置有关。如果
.babelrc
webpack.config.js
不在同一目录中,则必须手动移动或加载它:

{test: /\.js$/, use: {loader: 'babel-loader', options: require(/* path to babelrc */)}},

我得到这个错误是因为
mocha
没有使用
babel
并且不知道如何解释
es6

在我的
package.json中更改了此选项。添加:
--编译器js:babel核心/寄存器

"test": "./node_modules/.bin/mocha --compilers js:babel-core/register --reporter progress app/tools/testSetup.js \"app/**/*.test.js\"",

我得到这个错误是因为
mocha
没有使用
babel
并且不知道如何解释
es6

在我的
package.json中更改了此选项。添加:
--编译器js:babel核心/寄存器

"test": "./node_modules/.bin/mocha --compilers js:babel-core/register --reporter progress app/tools/testSetup.js \"app/**/*.test.js\"",

刚查过。这是在同一水平。我可以添加项目结构的照片,如果你以这种方式需要它,它会影响错误吗?添加了你提到的
require
部分,我仍然得到相同的错误=[刚刚检查。它处于同一级别。我可以添加项目结构的照片。如果您以这种方式需要它,它会影响错误吗?添加了您提到的
require
部分,我仍然会收到相同的错误=[