未捕获的SyntaxError：意外的令牌导入

运行应用程序时，我收到意外的令牌导入错误。 请看看我的网络包配置设置 -

- Webpack.config.js -

var path = require("path");

module.exports = {
    entry: ['./main.js'],
    output: {
      path: path.join(__dirname, 'build'),
      filename: "bundle.js",
      publicPath: '/build'
    },
    resolve: {
      modules: [
        path.resolve('./src'),
        path.resolve('./node_modules')
      ],
      extensions: ['.js','.jsx']
    },
    module: {
      loaders: [
        {
          test: /.jsx?$/,
          exclude: /node_modules/,
          loader: 'babel-loader',
          query: {
            presets: ['es2015', 'react']
          }
        },
      ]
    },
    devServer: {
      inline: true,
      port: 3000
   }

  };

---

.babelrc

{
  "presets": ["es2015"],
  "plugins": [
    ["transform-object-rest-spread"],
    ["transform-runtime", {
      "polyfill": false,
      "regenerator": true
    }],
  ]
}

---

--- ---的package.json

{
  "name": "pagination",
  "version": "1.0.0",
  "description": "about table pagination",
  "main": "main.js",
  "scripts": {
    "start": "webpack-dev-server --hot",
    "test": "echo "Error: no test specified" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "material-ui": "^0.16.7",
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "webpack": "^2.2.1",
    "webpack-dev-server": "^2.3.0"
  },
  "devDependencies": {
    "babel-core": "^6.22.1",
    "babel-loader": "^6.2.10",
    "babel-plugin-transform-object-rest-spread": "^6.22.0",
    "babel-plugin-transform-runtime": "^6.22.0",
    "babel-preset-es2015": "^6.22.0",
    "babel-preset-react": "^6.22.0",
    "babel-preset-stage-0": "^6.22.0",
    "install": "^0.8.7",
    "npm": "^4.2.0"
  }
}

---

正如您在代码中看到的，我已经设置了webpack。因此，尽管服务器启动成功，但它提供了一个错误

'未捕获的SyntaxError：意外的令牌导入'。

---

所以我建议你从.babelrc文件中删除预设，因为你已经将它们包含在你的webpack ，并且可能会导致问题，因为你没有在babelrc包含react preset 。

.babelrc

{
    "plugins": [
    ["transform-object-rest-spread"],
    ["transform-runtime", {
      "polyfill": false,
      "regenerator": true
    }],
  ]
}

其次确保你有适合所有你的进口像css，svg等装载机

module: {
   loaders: [
    { test: /.js$/,
      loader: 'babel-loader',
      exclude: /node_modules/,
      query: {
        presets: ['es2015', 'react']
      }
    },
    { test: /.css$/, loader: "style!css" },
    { test: /.(png|jpg|jpeg|gif|woff)$/, loader: 'url?limit=8192' },
    { test: /.(otf|eot|ttf)$/, loader: "file?prefix=font/" },
    { test: /.svg$/, loader: "file" }
  ],
}

您可以根据您的要求排除上述一些装载机，并确保您在使用前安装loaders

链接地址: http://www.djcxy.com/p/46005.html

上一篇: Uncaught SyntaxError: Unexpected token import

下一篇: Uncaught SyntaxError: Unexpected token < into DOCTYPE html PUBLIC