moj webpack.config.ts ma bledy po aktualizacji Webpacka do 5. Generalnie chodzi o file-loader i url-loader. Czy ktos ma pojecie jak to zmienic?
var webpack = require('webpack');
var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var CleanWebpackPlugin = require('clean-webpack-plugin');
var CopyPlugin = require('copy-webpack-plugin');
var TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
var { AureliaPlugin, ModuleDependenciesPlugin, GlobDependenciesPlugin } = require("aurelia-webpack-plugin");
var ProvidePlugin = require('webpack');
//var { TsConfigPathsPlugin, CheckerPlugin } = require('awesome-typescript-loader');
module.exports = (env) => {
const devMode = !env.production && !env.testproduction;
let mainChunkFileName = devMode ? "main.js" : "main.[chunkhash].js";
let apiPath = devMode ? "https://localhost:44316" : "https://tmr3api.mactexas.com";
// let apiPath = devMode ? "https://tmr3api.mactexas.com" : "https://tmr3api2.mactexas.com";
if(env.testproduction) {
apiPath = "https://test-tmr3api.mactexas.com";
console.log("We're in test production");
}
let devPath = "dist";
let prodPath = "dist";
let outputRel = devMode ? devPath : prodPath
let outputPath = path.resolve(__dirname, outputRel);
console.log("DevMode:" + devMode);
console.log("API Path:" + apiPath);
console.log("__dirname: " + __dirname);
console.log("Output Path: " + outputPath);
console.log("Main Chunk File Name:" + mainChunkFileName);
const config = {
entry: "aurelia-bootstrapper",
resolve: {
extensions: [".ts", ".js"],
modules: ["src", "node_modules"].map(x => path.resolve(x)),
alias: { jquery: "jquery/src/jquery", jQuery: "jquery/src/jquery" },
plugins: [new TsconfigPathsPlugin()]
},
// externals: {
// jQuery: 'window.jQuery',
// jquery: 'window.jQuery'
// },
module: {
rules: getRules()
},
mode: devMode ? "development": "production",
output: {
path: outputPath,
publicPath: "/",
filename: mainChunkFileName,
},
devServer: devMode ? {
port: 8080,
historyApiFallback: true,
} : undefined,
plugins: getCommonPlugins(devMode, apiPath)
.concat(devMode ? getDevPlugins() : getProdPlugins(outputPath)),
devtool: 'source-map',
};
return config;
};
function getRules() {
return [
{ test: /\.css$/i, use: ["style-loader", "css-loader"] },
{ test: /\.s[ac]ss$/i, use: [
// Creates `style` nodes from JS strings
"style-loader",
// Translates CSS into CommonJS
"css-loader",
// Compiles Sass to CSS
"sass-loader",
], },
{
test: /\.less$/i,
loaders: ["style-loader", "less-loader", "less-loader"]
},
{ test: /\.html$/i, use: "html-loader" },
{
test: /\.tsx?$/,
use: 'ts-loader',
exclude: /node_modules/
},
{ test: /\.json$/i, loader: 'json-loader' },
{ test: /\.(png|gif|jpg|cur|mp3)$/i, dependency: { not: ['url'] }, loader: 'url-loader', options: { limit: 8192 }, type: 'javascript/auto' },
{ test: /\.woff2(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: 'url-loader', options: { limit: 10000, mimetype: 'application/font-woff2' } },
{ test: /\.woff(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: 'url-loader', options: { limit: 10000, mimetype: 'application/font-woff' } },
// load these fonts normally, as files:
{ test: /\.(ttf|eot|svg|otf)(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: 'file-loader' },
]
}
function getDevPlugins() {
return [
// new webpack.SourceMapDevToolPlugin({
// exclude: ['vendor/.js']
// })
];
}
function getProdPlugins(distPath: string) {
return [
new CleanWebpackPlugin(["*.*", "fonts"], { root: distPath }),
];
}
function getCommonPlugins(devMode: boolean, apiPath: string) {
return [
new webpack.DefinePlugin({ __BUILDDATE__: new Date() }),
new webpack.DefinePlugin({ __API__: JSON.stringify(apiPath) }),
new webpack.DefinePlugin({ __DEVMODE__: devMode }),
new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en/), // include only the english moment components to save space
new AureliaPlugin(),
// new webpack.ProvidePlugin({
// $: "jquery",
// jQuery: "jquery",
// }),
new ModuleDependenciesPlugin({
"au-table": ["./au-table", "./au-table-select", "./au-table-sort"],
}),
new HtmlWebpackPlugin({
filename: "index.html",
template: path.resolve(__dirname, "index.html"),
chunks: ['main']
}),
new CopyPlugin([
'scripts/worker/*',
"translation-*.json",
"images/**/*",
"styles/**/*",
"pc/*.html",
"docs/**/*.pdf",
"scripts/*.js"
].map(x => ({
from: path.resolve(__dirname, 'vendor/pdfviewer', x),
to: path.resolve(__dirname, 'dist'),
toType: 'dir'
}))),
new CopyPlugin([
'web.config'
].map(x => ({
from: path.resolve(__dirname, '.', x),
to: path.resolve(__dirname, 'dist'),
toType: 'dir'
}))),
];
}
let_Majka