python-webpack-boilerplate
python-webpack-boilerplate copied to clipboard
Feature Request: Add ts-loader Support by Default in Webpack Configuration
Please add ts-loader to config by default, many npm packages usins ts files and the default doesnt complie
example 'preline'
heres a what i had to do to resolve this in my own case: webpack.config.watch.js
const Path = require("path");
const Webpack = require("webpack");
const { merge } = require("webpack-merge");
const StylelintPlugin = require("stylelint-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const ESLintPlugin = require("eslint-webpack-plugin");
const common = require("./webpack.common.js");
module.exports = merge(common, {
target: "web",
mode: "development",
devtool: "inline-source-map",
output: {
chunkFilename: "js/[name].chunk.js",
},
plugins: [
new Webpack.DefinePlugin({
"process.env.NODE_ENV": JSON.stringify("development"),
}),
new StylelintPlugin({
files: Path.resolve(__dirname, "../src/**/*.s?(a|c)ss"),
}),
new ESLintPlugin({
extensions: ["js", "ts"],
emitWarning: true,
files: Path.resolve(__dirname, "../src"),
}),
new MiniCssExtractPlugin({
filename: "css/[name].css",
chunkFilename: "css/[id].css",
}),
],
module: {
rules: [
{
test: /\.html$/i,
loader: "html-loader",
},
{
test: /\.js$/,
include: Path.resolve(__dirname, "../src"),
loader: "babel-loader",
},
{
test: /\.tsx?$/,
use: "ts-loader",
exclude: /node_modules/,
},
{
test: /\.s?css$/i,
use: [
MiniCssExtractPlugin.loader,
{
loader: "css-loader",
options: {
sourceMap: true,
},
},
"postcss-loader",
"sass-loader",
],
},
{
test: /\.tsx?$/,
include: /node_modules/,
use: {
loader: 'ts-loader',
options: {
transpileOnly: true
}
}
}
],
},
resolve: {
extensions: [".tsx", ".ts", ".js"],
},
});
`
```
Thank you for the awesome work