Всем добра!
Есть 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>, и импортировать в сборку?