Javascript 令人困惑的webpack/ES6项目设置

我正在尝试设置我的第一个ES6和网页包“应用程序”，并希望使用类和模块。但是每次我想通过

webpack

命令传输应用程序时，我都会遇到以下错误：

$ webpack
Hash: c91db5651ec9123b8959
Version: webpack 3.5.6
Time: 2319ms
    Asset       Size  Chunks                    Chunk Names
app.bundle.js     354 kB       0  [emitted]  [big]  main
   index.html  978 bytes          [emitted]
   [0] ./src/app.js 14 kB {0} [built]
    + 1 hidden module

ERROR in ./src/app.js
Module not found: Error: Can't resolve 'radar' in 'C:\dev\git\my-first-app\src'
 @ ./src/app.js 7:13-29
Child html-webpack-plugin for "index.html":
     1 asset
       [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 1.37 kB {0} [built]
       [2] (webpack)/buildin/global.js 509 bytes {0} [built]
       [3] (webpack)/buildin/module.js 517 bytes {0} [built]
        + 1 hidden module

我有以下文件

package.json

{
  "name": "my-first-app",
  "version": "1.0.0",
  "description": "",
  "main": "webpack.config.js",
  "scripts": {
    "build": "./node_modules/.bin/babel src -d dest",
    "start": "webpack-dev-server"
  }
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.0",
    "babel-preset-es2015": "^6.24.1",
    "webpack": "^3.5.6"
  },
  "dependencies": {
    "babel-polyfill": "^6.26.0",
    "d3": "3.5.17",
    "html-webpack-plugin": "^2.28.0",
    "webpack-dev-server": "^2.4.5"
  }
}

webpack.config.js

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    entry: './src/app.js',
    output: {
        path: path.resolve(__dirname, 'dest'),
        filename: 'app.bundle.js'
    },
    module: {
        loaders: [
            {
                loader: 'babel-loader',
                include: [
                    path.resolve(__dirname, "src")
                ],
                test: /\.js$/
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: 'src/index.html',
            filename: 'index.html',
            inject: 'body'
        })
    ]
};

src/app.js

'use strict';

import * as d3 from 'd3';
import radar from 'radar';

var r = new radar();
r.render();

雷达.js

'use strict';

import * as d3 from 'd3';

export default class radar {
    render() { ... }
}

html是一些基本的html文件，它只包含一个带有头和体的空文档

我想我的错误在webpack.config.js的某个地方，或者我混合了不同的技术来使用ES6。另外，命令

npm build

也没有帮助（似乎什么都没有发生）。

---

有人能帮我吗？我有点困惑，不知道要查找/搜索什么…

radar

是从

app.js

导入的，但它不在您的

package.json

依赖项列表中。 您可以从命令行运行

npm install radar--save

来安装软件包，并在

package.json中保存一个引用


如果雷达是本地文件，而不是包，则需要使用文件路径来导入它。比如：

import radar from './path/to/file/radar';

以下是如何在Webpack中解析导入语句-
radar
是从
app.js
导入的，但它不在您的
包.json
依赖项列表中。
您可以从命令行运行
npm install radar--save
来安装软件包，并在
package.json中保存一个引用


如果雷达是本地文件，而不是包，则需要使用文件路径来导入它。比如：

import radar from './path/to/file/radar';

以下是如何在Webpack中解析导入语句-
是否应在包中列出
radar
。json的依赖项？您在
src/app.js
中导入
'radar'
，但在
package.json
中的依赖项中缺少它。你确定它已经安装了吗？另外，
npm build
是一个内置的npm命令。如果要在
包.json
中运行脚本，请使用
npm run build
.Uhm。。。但雷达并不是一个正式的一揽子计划。我只是想导入我自己的雷达类（参见radar.js）。我是否还必须将每个文件添加为依赖项？尝试从“../Radar”导入雷达
或将基本URL设置为
。
；
radar
应该列在你的包.json的依赖项中吗？你正在
src/app.js
中导入
'radar'
，但是它在你的
包.json的依赖项中丢失了。你确定它已经安装了吗？另外，
npm build
是一个内置的npm命令。如果要在
包.json
中运行脚本，请使用
npm run build
.Uhm。。。但雷达并不是一个正式的一揽子计划。我只是想导入我自己的雷达类（参见radar.js）。我是否还必须将每个文件添加为依赖项？尝试从“../Radar”导入雷达
或将基本URL设置为
。
；