From d99607333b2915f23ffdae460937ac20f7498225 Mon Sep 17 00:00:00 2001 From: Gianluca Guarini Date: Sun, 27 Jan 2019 20:58:28 +0100 Subject: [PATCH] updated: use compiling meta instead of options --- build/rollup.browser.config.js | 2 +- package-lock.json | 2 +- src/generators/css/index.js | 9 +++++---- src/generators/javascript/index.js | 7 ++++--- src/generators/template/index.js | 5 +++-- src/index.js | 16 ++++++++-------- src/postprocessors.js | 8 ++++---- src/preprocessors.js | 6 +++--- src/transformer.js | 18 +++++++++--------- src/utils/create-node-sourcemap.js | 18 +++++------------- src/utils/preprocess-node.js | 11 ++++------- test/generators/css.spec.js | 23 ++++++++++------------- test/generators/javascript.spec.js | 4 ++-- test/helpers.js | 6 +++--- test/transformer.spec.js | 2 +- 15 files changed, 63 insertions(+), 74 deletions(-) diff --git a/build/rollup.browser.config.js b/build/rollup.browser.config.js index 0f7f2bc..ae47d85 100644 --- a/build/rollup.browser.config.js +++ b/build/rollup.browser.config.js @@ -34,7 +34,7 @@ export default { commonjs({ include: 'node_modules/**', namedExports: { - [sourcemapPath]: ['SourceMapGenerator', 'SourceMapConsumer'] + [sourcemapPath]: ['SourceMapGenerator', 'SourceMapConsumer', 'SourceNode'] }, ignoreGlobal: true }) diff --git a/package-lock.json b/package-lock.json index e2bc827..1f21281 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2817,7 +2817,7 @@ }, "chalk": { "version": "1.1.3", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", + "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", "requires": { "ansi-styles": "^2.2.1", diff --git a/src/generators/css/index.js b/src/generators/css/index.js index 8879861..b09f934 100644 --- a/src/generators/css/index.js +++ b/src/generators/css/index.js @@ -68,16 +68,17 @@ function scopedCSS(tag, css) { * Generate the component css * @param { Object } sourceNode - node generated by the riot compiler * @param { string } source - original component source code - * @param { Object } options - user options + * @param { Object } meta - compilation meta information * @param { AST } ast - current AST output * @returns { AST } the AST generated */ -export default async function css(sourceNode, source, options, ast) { +export default async function css(sourceNode, source, meta, ast) { const preprocessorName = getPreprocessorTypeByAttribute(sourceNode) + const { options } = meta const cssNode = sourceNode.text - const preprocessorOutput = await preprocess('css', preprocessorName, options, source, cssNode) + const preprocessorOutput = await preprocess('css', preprocessorName, meta, source, cssNode) const cssCode = (options.scopedCss ? - scopedCSS(options.tagName, preprocessorOutput.code) : + scopedCSS(meta.tagName, preprocessorOutput.code) : preprocessorOutput.code ).trim() const generatedCss = generateAST(`\`${cssCode}\``, { diff --git a/src/generators/javascript/index.js b/src/generators/javascript/index.js index 125aae7..15bdadf 100644 --- a/src/generators/javascript/index.js +++ b/src/generators/javascript/index.js @@ -59,14 +59,15 @@ function extendTagProperty(ast, exportDefaultNode) { * Generate the component javascript logic * @param { Object } sourceNode - node generated by the riot compiler * @param { string } source - original component source code - * @param { Object } options - user options + * @param { Object } meta - compilation meta information * @param { AST } ast - current AST output * @returns { AST } the AST generated */ -export default async function javascript(sourceNode, source, options, ast) { +export default async function javascript(sourceNode, source, meta, ast) { const preprocessorName = getPreprocessorTypeByAttribute(sourceNode) const javascriptNode = sourceNode.text - const preprocessorOutput = await preprocess('js', preprocessorName, options, source, javascriptNode) + const { options } = meta + const preprocessorOutput = await preprocess('js', preprocessorName, meta, source, javascriptNode) const jsInputSourceMap = composeSourcemaps( createNodeSourcemap(sourceNode, options.file, source), preprocessorOutput.map diff --git a/src/generators/template/index.js b/src/generators/template/index.js index e8526fb..5b9bc04 100644 --- a/src/generators/template/index.js +++ b/src/generators/template/index.js @@ -51,10 +51,11 @@ function extendTemplateProperty(ast, sourceFile, sourceCode, sourceNode) { * Generate the component template logic * @param { Object } sourceNode - node generated by the riot compiler * @param { string } source - original component source code - * @param { Object } options - user options + * @param { Object } meta - compilation meta information * @param { AST } ast - current AST output * @returns { AST } the AST generated */ -export default async function template(sourceNode, source, options, ast) { +export default async function template(sourceNode, source, meta, ast) { + const { options } = meta return extendTemplateProperty(ast, options.file, source, sourceNode) } \ No newline at end of file diff --git a/src/index.js b/src/index.js index 477ffee..b76df2b 100644 --- a/src/index.js +++ b/src/index.js @@ -45,7 +45,7 @@ export async function compile(source, options = {}) { ...options } - const { code, map } = await runPreprocessor('template', opts.template, opts, source) + const { code, map } = await runPreprocessor('template', opts.template, {}, source) const { template, css, javascript } = riotParser(opts).parse(code).output const meta = { options: opts, @@ -59,13 +59,13 @@ export async function compile(source, options = {}) { return ruit( createInitialInput(map), - hookGenerator(cssGenerator, css, code, opts), - hookGenerator(javascriptGenerator, javascript, code, opts), - hookGenerator(templateGenerator, template, code, opts), + hookGenerator(cssGenerator, css, code, meta), + hookGenerator(javascriptGenerator, javascript, code, meta), + hookGenerator(templateGenerator, template, code, meta), ast => recast.print(ast, { sourceMapName: 'map.json' }), - result => runPostprocessors(result, opts), + result => runPostprocessors(result, meta), result => ({ ...result, meta @@ -78,15 +78,15 @@ export async function compile(source, options = {}) { * @param { Function } transformer - transformer function * @param { Object } sourceNode - riot parser node * @param { string } source - component source code - * @param { Object } options - compiling options + * @param { Object } meta - compilation meta information * @returns { Promise } object containing output code and source map */ -function hookGenerator(transformer, sourceNode, source, options) { +function hookGenerator(transformer, sourceNode, source, meta) { if (!sourceNode || (sourceNode.nodes && !sourceNode.nodes.length)) { return result => result } - return curry(transformer)(sourceNode, source, options) + return curry(transformer)(sourceNode, source, meta) } // This function can be used to register new preprocessors diff --git a/src/postprocessors.js b/src/postprocessors.js index 24f0dee..fb95711 100644 --- a/src/postprocessors.js +++ b/src/postprocessors.js @@ -37,17 +37,17 @@ export function unregister(postprocessor) { /** * Exec all the postprocessors in sequence combining the sourcemaps generated * @param { Output } compilerOutput - output generated by the compiler - * @param { Object } options - user options received by the compiler + * @param { Object } meta - compiling meta information * @returns { Promise } object containing output code and source map */ -export async function execute(compilerOutput, options) { +export async function execute(compilerOutput, meta) { return Array.from(postprocessors).reduce(async function(acc, postprocessor) { const { code, map } = await acc - const output = await postprocessor(code, options) + const output = await postprocessor(code, meta) return { code: output.code, map: composeSourcemaps(output.map, map) } - }, Promise.resolve(createOutput(compilerOutput, options))) + }, Promise.resolve(createOutput(compilerOutput, meta))) } \ No newline at end of file diff --git a/src/preprocessors.js b/src/preprocessors.js index f8ed394..f0c821c 100644 --- a/src/preprocessors.js +++ b/src/preprocessors.js @@ -61,13 +61,13 @@ export function unregister(type, name) { * Exec the compilation of a preprocessor * @param { string } type - preprocessor type either 'js', 'css' or 'template' * @param { string } name - unique preprocessor id - * @param { Object } options - preprocessor options + * @param { Object } meta - preprocessor meta information * @param { string } source - source code * @returns { Promise } object containing a sourcemap and a code string */ -export async function execute(type, name, options, source) { +export async function execute(type, name, meta, source) { if (!preprocessors[type]) preprocessorTypeError(type) if (!preprocessors[type].has(name)) preprocessorNameNotFoundError(name) - return await transform(preprocessors[type].get(name), options, source) + return await transform(preprocessors[type].get(name), meta, source) } \ No newline at end of file diff --git a/src/transformer.js b/src/transformer.js index de5abd8..6eeb566 100644 --- a/src/transformer.js +++ b/src/transformer.js @@ -13,18 +13,18 @@ export const Output = Object.freeze({ * @param { string } data.code - code generated * @param { AST } data.ast - ast representing the code * @param { SourceMapGenerator } data.map - source map generated along with the code - * @param { Object } options - user options, probably containing the path to the source file + * @param { Object } meta - compilation meta infomration * @returns { Output } output container object */ -export function createOutput(data, options) { +export function createOutput(data, meta) { const output = Object.seal({ ...Output, ...data, - meta: { options } + meta }) - if (!output.map && options && options.file) Object.assign(output, { - map: createSourcemap({ file: options.file }) + if (!output.map && meta && meta.options && meta.options.file) Object.assign(output, { + map: createSourcemap({ file: meta.options.file }) }) return output @@ -33,11 +33,11 @@ export function createOutput(data, options) { /** * Transform the source code received via a compiler function * @param { Function } compiler - function needed to generate the output code - * @param { Object } options - options to pass to the compilert + * @param { Object } meta - compilation meta information * @param { string } source - source code * @returns { Promise } output - the result of the compiler */ -export async function transform(compiler, options, source) { - const result = await (compiler ? compiler(source, options) : { code: source }) - return createOutput(result, options) +export async function transform(compiler, meta, source) { + const result = await (compiler ? compiler(source, meta) : { code: source }) + return createOutput(result, meta) } \ No newline at end of file diff --git a/src/utils/create-node-sourcemap.js b/src/utils/create-node-sourcemap.js index ebdee1b..d882181 100644 --- a/src/utils/create-node-sourcemap.js +++ b/src/utils/create-node-sourcemap.js @@ -1,4 +1,4 @@ -import createSourcemap from './create-sourcemap' +import { SourceNode } from 'source-map' import getLineAndColumnByPosition from './get-line-and-column-by-position' /** @@ -9,17 +9,9 @@ import getLineAndColumnByPosition from './get-line-and-column-by-position' * @returns {SourceMapGenerator} source map generated */ export default function createNodeSourcemap(node, sourceFile, sourceCode) { - const sourcemap = createSourcemap({ file: sourceFile }) + const {line, column} = getLineAndColumnByPosition(sourceCode, node.start) - ;[node.start, node.end].forEach(position => { - const location = getLineAndColumnByPosition(sourceCode, position) - - sourcemap.addMapping({ - source: sourceFile, - generated: location, - original: location - }) - }) - - return sourcemap + return new SourceNode(null, null, sourceFile, [ + new SourceNode(line, column, sourceFile, sourceCode.slice(node.start, node.end)) + ]) } \ No newline at end of file diff --git a/src/utils/preprocess-node.js b/src/utils/preprocess-node.js index fc1b394..63fbbbe 100644 --- a/src/utils/preprocess-node.js +++ b/src/utils/preprocess-node.js @@ -1,22 +1,19 @@ -import getLineAndColumnByPosition from './get-line-and-column-by-position' import {execute as runPreprocessor} from '../preprocessors' /** * Preprocess a riot parser node * @param { string } preprocessorType - either css, js * @param { string } preprocessorName - preprocessor id - * @param { Object } options - options that will be passed to the compiler + * @param { Object } meta - compilation meta information * @param { string } source - tag source code * @param { RiotParser.nodeTypes } node - css node detected by the parser * @returns { Output } code and sourcemap generated by the preprocessor */ -export default async function preprocess(preprocessorType, preprocessorName, options, source, node) { - const { column } = getLineAndColumnByPosition(source, node.start) - const offsetTop = '\n'.repeat(column) - const code = `${offsetTop}\n${node.text}` +export default async function preprocess(preprocessorType, preprocessorName, meta, source, node) { + const code = node.text return await (preprocessorName ? - runPreprocessor(preprocessorType, preprocessorName, options, code) : + runPreprocessor(preprocessorType, preprocessorName, meta, code) : { code } ) } \ No newline at end of file diff --git a/test/generators/css.spec.js b/test/generators/css.spec.js index b1c8d20..17d1b4e 100644 --- a/test/generators/css.spec.js +++ b/test/generators/css.spec.js @@ -45,11 +45,10 @@ describe('Generators - CSS', () => { it('compile a simple css node', async function() { const { css } = parser().parse(simpleCSS).output - const ast = await compileCSS(css, simpleCSS, { + const ast = await compileCSS(css, simpleCSS, { options: { file: FAKE_FILE, - scopedCss: true, - tagName: 'my-tag' - }, createInput()) + scopedCss: true + }, tagName: 'my-tag' }, createInput()) const {code} = recast.print(ast) const output = evaluateScript(code) @@ -64,11 +63,10 @@ describe('Generators - CSS', () => { it('compile a simple css without scoping the css', async function() { const { css } = parser().parse(simpleCSS).output - const ast = await compileCSS(css, simpleCSS, { + const ast = await compileCSS(css, simpleCSS, { options: { file: FAKE_FILE, - scopedCss: false, - tagName: 'my-tag' - }, createInput()) + scopedCss: false + }, tagName: 'my-tag'}, createInput()) const {code} = recast.print(ast) const output = evaluateScript(code) @@ -82,16 +80,15 @@ describe('Generators - CSS', () => { it('compile a scss file and generate a proper sourcemap', async function() { const { css } = parser().parse(scssCSS).output - const ast = await compileCSS(css, scssCSS, { + const ast = await compileCSS(css, scssCSS, { options: { file: FAKE_FILE, - scopedCss: true, - tagName: 'my-tag' - }, createInput()) + scopedCss: true + }, tagName: 'my-tag'}, createInput()) const {code} = recast.print(ast) const output = evaluateScript(code) expect(ast).to.be.ok - expect(code).to.have.string('my-tag') + expect(code).to.have.string('[is="my-tag"]') expect(output.default.css).to.be.ok expect(output.default.tag).to.be.not.ok expect(output.default.template).to.be.not.ok diff --git a/test/generators/javascript.spec.js b/test/generators/javascript.spec.js index d6e0c2c..44483c9 100644 --- a/test/generators/javascript.spec.js +++ b/test/generators/javascript.spec.js @@ -35,9 +35,9 @@ describe('Generators - javascript', () => { it('compile a simple javascript code', async function() { const { javascript } = parser().parse(simpleJS).output - const ast = await compileJavascript(javascript, simpleJS, { + const ast = await compileJavascript(javascript, simpleJS, { options: { file: FAKE_FILE - }, createInput()) + }}, createInput()) const {code} = recast.print(ast) const output = evaluateScript(code) diff --git a/test/helpers.js b/test/helpers.js index 4b0a33a..78d5298 100644 --- a/test/helpers.js +++ b/test/helpers.js @@ -18,11 +18,11 @@ export function getExpected(name) { return String(sh.cat(`${EXPECTED_DIR}${name}.js`)) } -export function scssPreprocessor(source, { file }) { +export function scssPreprocessor(source, { options }) { const result = renderSync({ - file: file, + file: options.file, data: source, - outFile: file, + outFile: options.file, sourceMap: true }) diff --git a/test/transformer.spec.js b/test/transformer.spec.js index d97f8d1..863fb6e 100644 --- a/test/transformer.spec.js +++ b/test/transformer.spec.js @@ -33,7 +33,7 @@ describe('Transformer', () => { }) it('create an output object with a sourcemap if the file option was provided', () => { - const result = createOutput({ code: 'foo' }, { file: 'foo.js' }) + const result = createOutput({ code: 'foo' }, { options: { file: 'foo.js' }}) expect(result.code).to.be.equal('foo') expect(result.map).to.be.not.equal(null)