Целевая библиотека Webpack 4 umd x не является конструктором - PullRequest
Новая
       2

Целевая библиотека Webpack 4 umd x не является конструктором

0 голосов
/ 08 декабря 2018

У меня есть этот класс es6 в моем /src/index.js

class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }

    toString() {
        return `(${this.x}, ${this.y})`;
    }
}

export default Point;

, вот файл webpack.config.js 

const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    library: 'point',
    libraryTarget: 'umd',
    umdNamedDefine: true,
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  }
};

, поэтому, когда я включаю его в свой индексФайл .html, такой как: 

<!DOCTYPE html>
<html>
<head>
    <title>Webpack</title>
</head>
<body>

    <!-- Scripts -->
    <script src="dist/bundle.js"></script>

    <script type="text/javascript">
        new point(1, 3).toString()
    </script>
</body>
</html>

, поэтому у меня есть эта ошибка в консоли

«Uncaught TypeError: точка не является конструктором»

это тип сценария umd

почему я вижу эту ошибку при компиляции с веб-пакетом?

тот же сценарий работает нормально с накопительным пакетом

есть ли решение?

и еще одна вещь, которую я видел, что почти каждый разработчик использует накопительный пакет для разработки пакетов es6 для компиляции версий сценариев "esm", "umd".

, но я хочу использовать webpack вместо накопительного пакета.

Любое руководство?

спасибо

1 Ответ

0 голосов
/ 15 июля 2019

Пожалуйста, добавьте libraryExport: 'default', в output раздел конфигурации Webpack.

как-то так (для вашего случая), 

const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    library: 'point',
    libraryTarget: 'umd',
    umdNamedDefine: true,
    libraryExport: 'default',
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  }
};
...