beyond/lib/engine/bundles/processors/vue/packager/compiler/index.js

The Full Stack Universal Typescript Framework

const vue = require('vue/compiler-sfc');
const {ProcessorSinglyCompiler} = require('beyond/sdk');

module.exports = class extends ProcessorSinglyCompiler {
    #CompiledSource = require('./source');
    get CompiledSource() {
        return this.#CompiledSource;
    }

    _compileSource(source, is) {
        const {extended} = this;
        const {processor, distribution} = this.packager;

        const filename = source.url;
        const scopeId = source.relative.file
            .slice(0, source.relative.file.length - 4) // remove .vue extension
            .replace(/\//g, '__');

        let css;
        try {
            if (extended.get('sass').has(source.relative.file)) {
                const preprocessed = extended.get('sass').get(source.relative.file);
                const {content, scoped, map: inMap} = preprocessed;
                css = vue.compileStyle({id: scopeId, filename, scoped, source: content, inMap});
                if (css.errors?.length) return {errors: css.errors};
            }
        }
        catch (exc) {
            return {errors: [`Error compiling style: ${exc.message}`]};
        }

        let descriptor;
        try {
            const options = {sourceMap: source.map, filename};
            let errors;
            ({descriptor, errors} = vue.parse(source.content, options));
            if (errors?.length) return {errors: ['Error parsing component']};
        }
        catch (exc) {
            return {errors: [`Error parsing component: ${exc.message}`]};
        }

        let template;
        try {
            template = vue.compileTemplate({source: descriptor.template.content, filename, id: scopeId});
        }
        catch (exc) {
            return {errors: [`Error parsing component: ${exc.message}`]};
        }

        const script = extended.get('ts').has(source.relative.file) ?
                       extended.get('ts').get(source.relative.file) : void 0;

        // TODO @ftovar - @box
        //  Pendiente el caso de uso: no lee los archivos en las subparteas del path
        if (!script) {
            console.error(`File "${source.relative.file}" could not be processed`);
            return;
        }

        const compiled = new this.#CompiledSource(processor, distribution, is, source, {
            scopeId,
            code: script.code, map: script.map,
            css: css?.code, cssMap: css?.map,
            template: template.code, templateMap: template.map
        });

        return {compiled};
    }
}