|
|
- const merge = require('merge-source-map')
-
- export interface StylePreprocessor {
- render(
- source: string,
- map: any | null,
- options: any
- ): StylePreprocessorResults
- }
-
- export interface StylePreprocessorResults {
- code: string
- map?: any
- errors: Array<Error>
- }
-
- // .scss/.sass processor
- const scss: StylePreprocessor = {
- render(
- source: string,
- map: any | null,
- options: any
- ): StylePreprocessorResults {
- const nodeSass = require('sass')
- const finalOptions = Object.assign({}, options, {
- data: source,
- file: options.filename,
- outFile: options.filename,
- sourceMap: !!map
- })
-
- try {
- const result = nodeSass.renderSync(finalOptions)
-
- if (map) {
- return {
- code: result.css.toString(),
- map: merge(map, JSON.parse(result.map.toString())),
- errors: []
- }
- }
-
- return { code: result.css.toString(), errors: [] }
- } catch (e) {
- return { code: '', errors: [e] }
- }
- }
- }
-
- const sass = {
- render(
- source: string,
- map: any | null,
- options: any
- ): StylePreprocessorResults {
- return scss.render(
- source,
- map,
- Object.assign({}, options, { indentedSyntax: true })
- )
- }
- }
-
- // .less
- const less = {
- render(
- source: string,
- map: any | null,
- options: any
- ): StylePreprocessorResults {
- const nodeLess = require('less')
-
- let result: any
- let error: Error | null = null
- nodeLess.render(
- source,
- Object.assign({}, options, { syncImport: true }),
- (err: Error | null, output: any) => {
- error = err
- result = output
- }
- )
-
- if (error) return { code: '', errors: [error] }
-
- if (map) {
- return {
- code: result.css.toString(),
- map: merge(map, result.map),
- errors: []
- }
- }
-
- return { code: result.css.toString(), errors: [] }
- }
- }
-
- // .styl
- const styl = {
- render(
- source: string,
- map: any | null,
- options: any
- ): StylePreprocessorResults {
- const nodeStylus = require('stylus')
- try {
- const ref = nodeStylus(source)
- Object.keys(options).forEach(key => ref.set(key, options[key]))
- if (map) ref.set('sourcemap', { inline: false, comment: false })
-
- const result = ref.render()
- if (map) {
- return {
- code: result,
- map: merge(map, ref.sourcemap),
- errors: []
- }
- }
-
- return { code: result, errors: [] }
- } catch (e) {
- return { code: '', errors: [e] }
- }
- }
- }
-
- export const processors: { [key: string]: StylePreprocessor } = {
- less,
- sass,
- scss,
- styl,
- stylus: styl
- }
|