Почему возникает ошибка при импорте файла в js(es6)?

При сборке не возникает не каких ошибок, но когда начинаешь загрузку сайта то высвечивается такая ошибка:
NeGD0YM.png
Файл конфигурации webpack =>
var path = require("path");

module.exports = {
    entry: path.resolve(__dirname, './app/main.js'),
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, './public')
    },

    module: {
        rules: [
            {
                test: /\.js$/,
                loader: 'babel-loader',
                query: {
                    presets: ['es2015']
                }
            }
        ]
    },

    stats: {
        colors: true
    },

    devtool: 'source-map',
    
    watch: true,
    watchOptions: {
        aggregateTimeout: 300,
        poll: 1000
    }
}

Файл main.js =>
"use strict"
import { Object } from "./object.js";

class Main {
    constructor() {
        console.log("call constructor");
        this.scene = new THREE.Scene();
        this.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
        this.render = new THREE.WebGLRenderer();
        this.render.setSize(window.innerWidth, window.innerHeight);
        document.body.appendChild( this.render.domElement );
        this.settingCamera();
        //this.scene.add(Object.createCube());
        this.rendering();
    }

    settingCamera() {
        this.camera.position.z = 5;
    }

    rendering() {
        requestAnimationFrame(() => { this.rendering(); });
        // code...
        this.render.render(this.scene, this.camera);
    }
}

new Main();

А вот сам файл object.js =>
"use strict"

/**
 * Класс создающий примитивы
 */
export class Object {
    constructor() {}
    static createCube(size = null, color = 0x00ff00) {
        let geometry = null;
        if(size != null) geometry = new THREE.BoxGeometry(size.x, size.y, size.z);
        geometry = new THREE.BoxGeometry(1, 1, 1);
        let material = new THREE.MeshBasicMaterial({ color: color });
        return new THREE.Mesh(geometry, material);
    }
}

Ну а вот файл package.json =>
{
  "name": "testthreejs",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack"
  },
  "author": "mafof",
  "license": "ISC",
  "devDependencies": {
    "babel-polyfill": "^6.26.0",
    "webpack": "^4.8.3",
    "babel-core": "6.26.3",
    "babel-loader": "^7.1.4",
    "babel-preset-es2015": "6.24.1",
    "webpack-cli": "^2.1.4"
  }
}
  • Вопрос задан
  • 220 просмотров
Решения вопроса 1
Lynn
@Lynn
nginx, js, css
Плохая идея использовать имя Object для своего класса. Оооочень плохая.
https://developer.mozilla.org/ru/docs/Web/JavaScri...
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
string15
@string15
Учусь верстать руками
Возможна проблема в настройках babel. Загляните в доки и посмотрите как там нужно настраивать!
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы