feat(all): use config-css as base

Author: niieani

package.json

@@ -38,10 +38,8 @@
     "typings": "^1.3.1"
   },
   "dependencies": {
-    "css-loader": "^0.23.1",
-    "extract-text-webpack-plugin": "^2.0.0-beta",
-    "less-loader": "^2.2.3",
-    "style-loader": "^0.13.1"
+    "@easy-webpack/config-css": "^2.2.1",
+    "less-loader": "^2.2.3"
   },
   "peerDependencies": {
     "@easy-webpack/core": "*"

src/index.ts

@@ -1,4 +1,5 @@
 import {WebpackConfig, get} from '@easy-webpack/core'
+import * as easyCss from '@easy-webpack/config-css'
 const ExtractTextPlugin = require('extract-text-webpack-plugin')
 
 /**
@@ -9,43 +10,7 @@ const ExtractTextPlugin = require('extract-text-webpack-plugin')
  * extractText: do you want to extract all css to a separate file? boolean, configuration object or instance of ExtractTextPlugin, defaults to true
  * resolveRelativeUrl: boolean or object with parameters
  */
-export = function less({ filename = '[name].css', allChunks = false, sourceMap = false, extractText = undefined, resolveRelativeUrl = undefined } = {}) {
-  return function less(this: WebpackConfig): WebpackConfig {
-    const loaders = ['style', `css${sourceMap ? '?sourceMap' : ''}`]
-
-    if (resolveRelativeUrl) {
-      loaders.push(`resolve-url${sourceMap ? '?sourceMap' : ''}`)
-      sourceMap = true // source maps need to be on for this
-    }
-
-    loaders.push(`less${sourceMap ? '?sourceMap' : ''}`)
-
-    const extractCss = extractText !== false
-    const providedInstance = extractText instanceof ExtractTextPlugin
-    if (!providedInstance)
-      extractText = extractCss ? new ExtractTextPlugin(filename, extractText instanceof Object ? extractText : { allChunks, sourceMap }) : null
-    const config = {
-      module: {
-        loaders: get(this, 'module.loaders', []).concat([{
-          test: /\.less$/i,
-          loaders: extractCss ? extractText.extract(...loaders.slice(1)) : loaders
-        }])
-      }
-    } as WebpackConfig
-    if (extractText && !providedInstance) {
-      config.plugins = [
-        /**
-         * Plugin: ExtractTextPlugin
-         * It moves every import "style.css" in entry chunks into a single concatenated css output file. 
-         * So your styles are no longer inlined into the javascript, but separate in a css bundle file (styles.css). 
-         * If your total stylesheet volume is big, it will be faster because the stylesheet bundle is loaded in parallel to the javascript bundle.
-         */
-        extractText
-      ].concat(get(this, 'plugins', []))
-    }
-    if (resolveRelativeUrl instanceof Object) {
-      config['resolveUrlLoader'] = resolveRelativeUrl
-    }
-    return config
-  }
-}
+export = function less({ filename = '[name].css', allChunks = false, sourceMap = false, extractText = undefined, resolveRelativeUrl = undefined, additionalLoaders = [] } = {}) {
+  additionalLoaders.push(`less${sourceMap ? '?sourceMap' : ''}`)
+  return easyCss({ test: /\.less$/i, filename, allChunks, extractText, resolveRelativeUrl, sourceMap, additionalLoaders })
+}