@ -1,12 +1,10 @@
const cssnano = require ( 'cssnano' ) ;
const fastGlob = require ( 'fast-glob' ) ;
const wrapAnsi = require ( 'wrap-ansi' ) ;
const CssNanoPlugin = require ( 'cssnano-webpack-plugin' ) ;
const FixStyleOnlyEntriesPlugin = require ( 'webpack-fix-style-only-entries' ) ;
const MiniCssExtractPlugin = require ( 'mini-css-extract-plugin' ) ;
const MonacoWebpackPlugin = require ( 'monaco-editor-webpack-plugin' ) ;
const OptimizeCSSAssetsPlugin = require ( 'optimize-css-assets-webpack-plugin' ) ;
const PostCSSPresetEnv = require ( 'postcss-preset-env' ) ;
const PostCSSSafeParser = require ( 'postcss-safe-parser' ) ;
const SpriteLoaderPlugin = require ( 'svg-sprite-loader/plugin' ) ;
const TerserPlugin = require ( 'terser-webpack-plugin' ) ;
const VueLoaderPlugin = require ( 'vue-loader/lib/plugin' ) ;
@ -24,19 +22,31 @@ for (const path of glob('web_src/less/themes/*.less')) {
const isProduction = process . env . NODE_ENV !== 'development' ;
const filterCssImport = ( parsedImport , cssFile ) => {
const url = parsedImport && parsedImport . url ? parsedImport . url : parsedImport ;
const importedFile = url . replace ( /[?#].+/ , '' ) . toLowerCase ( ) ;
if ( cssFile . includes ( 'monaco' ) ) return true ;
if ( cssFile . includes ( 'fomantic' ) ) {
if ( /brand-icons/ . test ( importedFile ) ) return false ;
if ( /(eot|ttf|woff)$/ . test ( importedFile ) ) return false ;
return true ;
}
return cssFile . includes ( 'node_modules' ) ;
} ;
module . exports = {
mode : isProduction ? 'production' : 'development' ,
entry : {
index : [
resolve ( __dirname , 'web_src/js/jquery.js' ) ,
resolve ( __dirname , 'web_src/fomantic/build/semantic.js' ) ,
resolve ( __dirname , 'web_src/js/index.js' ) ,
resolve ( __dirname , 'web_src/fomantic/build/semantic.css' ) ,
resolve ( __dirname , 'web_src/less/index.less' ) ,
] ,
swagger : [
resolve ( __dirname , 'web_src/js/standalone/swagger.js' ) ,
] ,
jquery : [
resolve ( __dirname , 'web_src/js/jquery.js' ) ,
] ,
serviceworker : [
resolve ( __dirname , 'web_src/js/serviceworker.js' ) ,
] ,
@ -66,12 +76,9 @@ module.exports = {
} ,
} ,
} ) ,
new OptimizeCSSAssetsPlugin ( {
cssProcessor : cssnano ,
cssProcessorOptions : {
parser : PostCSSSafeParser ,
} ,
cssProcessorPluginOptions : {
new CssNanoPlugin ( {
sourceMap : true ,
cssnanoOptions : {
preset : [
'default' ,
{
@ -91,10 +98,10 @@ module.exports = {
monaco : {
test : /monaco-editor/ ,
name : 'monaco' ,
chunks : 'async'
}
}
}
chunks : 'async' ,
} ,
} ,
} ,
} ,
module : {
rules : [
@ -150,12 +157,41 @@ module.exports = {
] ,
'@babel/plugin-proposal-object-rest-spread' ,
] ,
generatorOpts : {
compact : false ,
} ,
} ,
} ,
] ,
} ,
{
test : /\.(less|css)$/i ,
test : /.css$/i ,
use : [
{
loader : MiniCssExtractPlugin . loader ,
} ,
{
loader : 'css-loader' ,
options : {
importLoaders : 1 ,
url : filterCssImport ,
import : filterCssImport ,
sourceMap : true ,
} ,
} ,
{
loader : 'postcss-loader' ,
options : {
plugins : ( ) => [
PostCSSPresetEnv ( ) ,
] ,
sourceMap : true ,
} ,
} ,
] ,
} ,
{
test : /.less$/i ,
use : [
{
loader : MiniCssExtractPlugin . loader ,
@ -164,11 +200,10 @@ module.exports = {
loader : 'css-loader' ,
options : {
importLoaders : 2 ,
url : ( _url , resourcePath ) => {
// only resolve URLs for dependencies
return resourcePath . includes ( 'node_modules' ) ;
} ,
}
url : filterCssImport ,
import : filterCssImport ,
sourceMap : true ,
} ,
} ,
{
loader : 'postcss-loader' ,
@ -176,10 +211,14 @@ module.exports = {
plugins : ( ) => [
PostCSSPresetEnv ( ) ,
] ,
sourceMap : true ,
} ,
} ,
{
loader : 'less-loader' ,
options : {
sourceMap : true ,
} ,
} ,
] ,
} ,
@ -232,9 +271,10 @@ module.exports = {
chunkFilename : 'css/[name].css' ,
} ) ,
new SourceMapDevToolPlugin ( {
filename : 'js/[name].js .map' ,
filename : '[file] .map' ,
include : [
'js/index.js' ,
'css/index.css' ,
] ,
} ) ,
new SpriteLoaderPlugin ( {
@ -251,12 +291,6 @@ module.exports = {
modulesDirectories : [
resolve ( __dirname , 'node_modules' ) ,
] ,
additionalModules : [
{
name : 'fomantic-ui' ,
directory : resolve ( __dirname , 'node_modules/fomantic-ui' ) ,
} ,
] ,
renderLicenses : ( modules ) => {
const line = '-' . repeat ( 80 ) ;
return modules . map ( ( module ) => {
silverwind
4 years ago
GitHub