1) Отдельно собирать scss файлы из точки входа index.scss
Примерно такой конфиг:
const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
entry: path.join(__dirname, 'src/styles/entry.scss'),
output: {
filename: 'drop-it.js', // от js артефакта никуда не деться, но файл по сути будет пустой
path: path.join(__dirname, 'dist')
},
module: {
rules: [{
test: /\.scss$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']
}]
},
plugins: [new MiniCssExtractPlugin({
filename: 'styles.css'
})]
};
Отдельно собирать ts файлы из точки входа index.ts
да без проблем, опять таки нужен будет ts-loader. Ну и скажу свое ИМХО тут, что транспайлинг лучше не доверять тайпскрипту, а подключить бабель с пресетом env
ну и не забыть настроить как для бабеля так и в ts-config, что выходные модули должны быть ES, иначе останетесь без тришейкинга.
Отдельно проходиться по всем html файлам из папки src/html и складывать их в /output/
с этим уже по заморочнее будет
Для импортов думаю нужен какой то препроцессор будет, ща с ходу и не соображу, чем можно, сам разве что на handlebars такое делал
Для обработки вебпаком можно взять это
https://webpack.js.org/loaders/html-loader/
Для подключения всех файлов из папки по образцу можно использовать
https://webpack.js.org/api/module-methods/#require...
ну и еще нужно будет как то извлечь все в отдельные файлы, хотя я лично бы не парился с поиском готовых решений, а просто воткнул бы свой лоадер и в нем бы писал все в файл
Простой
