Javascript-导入模块时出现网页包错误

我的脚本有一个文件夹

assets/js

。我制作了两个脚本，就像文件夹中的文档中显示的那样。一个处理ajax请求，另一个导入它。这就是文件

ajax.js

：

function getJSON(url, callback) {
  let xhr = new XMLHttpRequest();
  xhr.onload = function () {
    callback(this.responseText)
  };
  xhr.open('GET', url, true);
  xhr.send();
}

export function getUsefulContents(url, callback) {
  getJSON(url, data => callback(JSON.parse(data)));
}

这是

app.js

import { getUsefulContents } from 'ajax';

var url = 'someUrl.com';

getUsefulContents(url, data => {
  console.log(data);
});

我已经安装了babel core、babel loader和babel-preset-es2015。webpack.config.js的设置如下：

module.exports = {
  entry: './assets/js/app.js',
  output: {
    filename: './dist/app.js'
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015']
        }
      }
    ]
  }
}

但是，我得到：

ERROR in ./assets/js/app.js
Module not found: Error: Can't resolve 'ajax' in '/Users/myUser/Projects/Pagination/assets/js'
 @ ./assets/js/app.js 3:12-27
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./assets/js/app.js

这是我在运行

webpack--display error details

命令时遇到的详细错误：

ERROR in ./assets/js/app.js
Module not found: Error: Can't resolve 'ajax' in '/Users/myUser/Projects/Pagination/assets/js'
resolve 'ajax' in '/Users/myUser/Projects/Pagination/assets/js'
  Parsed request is a module
  using description file: /Users/myUser/Projects/Pagination/package.json (relative path: ./assets/js)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: /Users/myUser/Projects/Pagination/package.json (relative path: ./assets/js)
    resolve as module
      /Users/myUser/Projects/node_modules doesn't exist or is not a directory
      /Users/myUser/node_modules doesn't exist or is not a directory
      /Users/node_modules doesn't exist or is not a directory
      /node_modules doesn't exist or is not a directory
      /Users/myUser/Projects/Pagination/assets/js/node_modules doesn't exist or is not a directory
      /Users/myUser/Projects/Pagination/assets/node_modules doesn't exist or is not a directory
      looking for modules in /Users/myUser/Projects/Pagination/node_modules
        using description file: /Users/myUser/Projects/Pagination/package.json (relative path: ./node_modules)
          Field 'browser' doesn't contain a valid alias configuration
        after using description file: /Users/myUser/Projects/Pagination/package.json (relative path: ./node_modules)
          using description file: /Users/myUser/Projects/Pagination/package.json (relative path: ./node_modules/ajax)
            as directory
              /Users/myUser/Projects/Pagination/node_modules/ajax doesn't exist
            no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/myUser/Projects/Pagination/node_modules/ajax doesn't exist
            .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/myUser/Projects/Pagination/node_modules/ajax.js doesn't exist
            .json
              Field 'browser' doesn't contain a valid alias configuration
              /Users/myUser/Projects/Pagination/node_modules/ajax.json doesn't exist

当我将导入行更改为以下内容时：

import { getUsefulContents } from './ajax';

我得到：

Uncaught SyntaxError: Unexpected token import

---

我做错了什么？

该错误看起来像是您在浏览器中加载了

import

语句。你是不是碰巧在HTML中包含了原始源代码？哦，是的，当我开始使用webpack时，我忘了更改路径，非常感谢！该错误看起来像是您在浏览器中加载了

import

语句。你是不是碰巧在HTML中包含了原始源代码？哦，是的，当我开始使用webpack时，我忘了更改路径，非常感谢！