powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / TypeScript + Webpack code splitting
3 сообщений из 3, страница 1 из 1
TypeScript + Webpack code splitting
    #39471862
Фотография FishHook
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Приветствую, пытаюсь реализовать загрузку модулей по требованию. Элементарный тестовый пример - класс с одним методом, вынесенный в отдельный файл.

Код: javascript
1.
2.
3.
4.
5.
6.
7.
import {Jedi} from './interfaces'

export class Vader implements Jedi {
    say(): string {
        return "Luke, I`m your father!";
    }
}



далее этот класс юзаем

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
//vadet.ts
import {Jedi} from './interfaces'

export class Vader implements Jedi {
    say(): string {
        return "Luke, I`m your father!";
    }
}


//app.ts
import {Vader} from "./jedies/vader"
const vader = new Vader();
function write(phrase: string): void{
    document.getElementById("container").innerHTML += `<p>${phrase}</p>`;
}
write(vader.say())



Вебпак отрабатывает как положено, создается бандл и все работает.
Но если я пытаюсь подгрузить модуль динамически

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
declare var require;

function write(phrase: string): void{
    document.getElementById("container").innerHTML += `<p>${phrase}</p>`;
}

require(["./jedies/vader"], (Vader)=> {
     let vader = new Vader();
     vader.say();
});



Вебпак, как ему и положено, создает бандл и отдельный файл для модуля, но в консоли браузера я вижу сообщение об ошибке, TypeError: Object is not a constructor (evaluating 'new Vader()').




Как мне все-таки получить класс on demand?
...
Рейтинг: 0 / 0
TypeScript + Webpack code splitting
    #39473472
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
было бы не плохо посмотреть на require.config вполне возможно что проблема именно там, например криво указан базовый путь
...
Рейтинг: 0 / 0
TypeScript + Webpack code splitting
    #39473553
Фотография FishHook
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Тshаmilбыло бы не плохо посмотреть на require.config
он не нужен для webpack, webpack сам управляет загрузкой модулей.
Проблему я, собственно, решил. Как обычно все было тривиально: require возвращает не объект, а модуль. Надо было сделать так

Код: javascript
1.
2.
3.
4.
require(["./jedies/vader"], (module)=> {
     let vader = new module.Vader();
     vader.say();
});



В общем, тему можно закрывать
...
Рейтинг: 0 / 0
3 сообщений из 3, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / TypeScript + Webpack code splitting
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]