модуль webpack es6 не найден

Question

Я новичок в Webpack, хочу связать мои js классы. Я использую классы es6 и linq js .min, jquery -3.4.1. js и gsap.min для начинающих. Я хочу только связать индекс. js и мой класс, но я получаю ошибку Модуль не найден: невозможно разрешить (myclass) в каталоге sr c в моем индексе. js для импорта класса:

import myClass from 'js/myClass'

и для экспорта моего класса я использовал

export class myClass{ } и module.export= myClass

мой webpack.config. js это:

const HTMLWebPackPlugin = require ('html-webpack-plugin');
module.exports = {
module:{
    rules:[
        {
            test: /\.js$/,
            exclude:/node_modules/,
            use:{
                loader:"babel-loader"
            }
        },
        {
            test:/\.html$/,
            use:[{
                loader:"html-loader",
                options:{minimize:true}
            }]
        }
    ]
},
plugins:[
    new HTMLWebPackPlugin({
        template:"./src/index.html",
        filename: "./index.html"
    })
]}

Я не понимаю Моя ошибка, как я могу это исправить. Спасибо.

Answer 1

Вы пытаетесь выполнить импорт по умолчанию, тогда как вы делаете именованный экспорт.

Либо go с по умолчанию экспортом, добавляя ключевое слово default:

export default class MyClass {}

вместе с

import MyClass from './js/MyClass.js';

Или go с с именем Экспорт / импорт:

export class MyClass {}

с

import { MyClass } from './js/MyClass.js';

Обратите внимание, что условно имена классов начинаются с заглавной буквы.

У Medium есть хорошая статья о разнице: https://medium.com/@etherealm / named-export-vs-default-export -в-ES6-affb483a0910