@fiter

Typescript — как создать бандл для импорта в сбору без typescript?

Всем добра!
Есть typescript либа, назовём её my-sample-lib, которую собирает webpack. На выходе хочу получить бандл, который можно как просто подключить в теге <script>, так и импортировать в другую сборку, в которой не используется typescript:
// примерно так
import MySampleLib from 'vendor/my-sample-lib/dist/js/my-sample-lib.js'
window.MySampleLib = MySampleLib;

webpack.config.js:
entry: {
  'my-sample-lib': './src/index.ts',
},
  output: {
    filename: './dist/js/[name].js',
    path: path.resolve( __dirname ),
}

src/index.ts:
import './scss/my-sample-lib/main.scss';
import MySampleLib from './ts/my-sample-lib';
export default MySampleLib;


С таким конфигом бандл не работает ни в сборке, ни в теге. Если допилить конфиг до такого состояния:
output: {
    filename: './dist/js/[name].js',
    path: path.resolve( __dirname ),
    library: 'MySampleLib',
    libraryTarget: 'umd',
}

То бандл импортируется в сборку, но через тег <script> не работает:
<script src="/dist/js/my-sample-lib.js'">
<script>
console.log( MySampleLib ); // {__esModule: true, default: ƒ}
</script>

Как настроить webpack так, чтобы бандл можно было и просто подключать в теге <script>, и импортировать в сборку?
  • Вопрос задан
  • 111 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы