diff --git a/package.json b/package.json index 4e2bf39..4831ef9 100644 --- a/package.json +++ b/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": "*" diff --git a/src/index.ts b/src/index.ts index 44922d7..eedf373 100644 --- a/src/index.ts +++ b/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 }) +} \ No newline at end of file