diff --git a/src/LiveEditingManager.ts b/src/LiveEditingManager.ts index 25e0411..cc9d994 100644 --- a/src/LiveEditingManager.ts +++ b/src/LiveEditingManager.ts @@ -23,7 +23,7 @@ export async function generateLiveEditing(options: ILiveEditingOptions, baseDir console.log("-----------------------------------------------------"); console.log("Starting Live-Editing Generation - for " + baseDir); - new SharedAssetsGenerator(options.samplesDir).generateSharedAssets(); + new SharedAssetsGenerator(options).generateSharedAssets(); await new SampleAssetsGenerator(options).generateSamplesAssets() .then(console.log) diff --git a/src/generators/SampleAssetsGenerator.ts b/src/generators/SampleAssetsGenerator.ts index 2df74c6..3439c60 100644 --- a/src/generators/SampleAssetsGenerator.ts +++ b/src/generators/SampleAssetsGenerator.ts @@ -156,12 +156,27 @@ export class SampleAssetsGenerator { let fileContent = fs.readFileSync(path.join(componentFilePath), "utf8"); let file = new LiveEditingFile(componentFilePath.substr(componentFilePath.indexOf("src")), fileContent, true, COMPONENT_FILE_EXTENSIONS[i], COMPONENT_FILE_EXTENSIONS[i]); this._shortenComponentPath(config, file); + if(this.options.additionalSharedStyles?.length && + COMPONENT_FILE_EXTENSIONS[i] === COMPONENT_STYLE_FILE_EXTENSION + && config.shortenComponentPathBy) this.resolveRelativePathToGlobalStyles(config.shortenComponentPathBy, file); + componentFiles.push(file); } return componentFiles; } + private resolveRelativePathToGlobalStyles(shortenPath: string , stylefile: LiveEditingFile) { + let shortenPathToRelative = shortenPath.replace(new RegExp(/\//g), " ").trim().split(" ").map(() =>"..").join("/") + "/"; + let importStatements = stylefile.content.match(new RegExp(/@import ("|')([\.\.]{2}\/){2,}[^;]*/g)); + if(importStatements?.length) { + importStatements.forEach(s => { + let newRel = s.replace(shortenPathToRelative, ""); + stylefile.content = stylefile.content.replace(s, newRel); + }); + } + } + private _getAdditionalFiles(config: Config): LiveEditingFile[] { let additionalFiles = new Array(); for (let i = 0; i < config.additionalFiles.length; i++) { diff --git a/src/generators/SharedAssetsGenerator.ts b/src/generators/SharedAssetsGenerator.ts index 6ef87fe..93de7b5 100644 --- a/src/generators/SharedAssetsGenerator.ts +++ b/src/generators/SharedAssetsGenerator.ts @@ -5,6 +5,7 @@ import { LiveEditingFile, SAMPLE_APP_FOLDER, SAMPLE_SRC_FOLDER } from "./misc/Li import { SharedAssetsFile } from "./misc/SharedAssetsFile"; import { SharedAssetsGeneratorArgs } from "./misc/SharedAssetsGeneratorArgs"; import { DevDependencyResolver } from "../services/DependencyResolver"; +import { ILiveEditingOptions } from "../public"; const INDEX_FILE_PATH = path.join(process.cwd(), "src/index.html"); const POLYPFILLS_FILE_PATH = path.join(process.cwd(), "src/polyfills.ts"); const STYLES_FILE_PATH = path.join(process.cwd(), "src/styles.scss"); @@ -14,7 +15,7 @@ const APP_COMPONENT_SCSS_PATH = path.join(process.cwd(), "src/app/app.component. const APP_COMPONENT_TS_PATH = path.join(__dirname, "../templates/app.component.ts.template"); export class SharedAssetsGenerator { - constructor(private sampleAssetsDir: string) { + constructor(private options: ILiveEditingOptions) { console.log("Live-Editing - SharedAssetsGenerator... "); } @@ -36,6 +37,12 @@ export class SharedAssetsGenerator { let files = new Array(); let polyfillsFile = fs.readFileSync(POLYPFILLS_FILE_PATH, "utf8"); + if(this.options.additionalSharedStyles?.length) { + this.options.additionalSharedStyles.forEach(fileName => { + let filePath = path.join(process.cwd(), SAMPLE_SRC_FOLDER, fileName); + files.push(new LiveEditingFile(SAMPLE_SRC_FOLDER + fileName, fs.readFileSync(filePath, "utf8"))) + }); + } files.push(new LiveEditingFile(SAMPLE_SRC_FOLDER + "index.html", indexFile)); files.push(new LiveEditingFile(SAMPLE_SRC_FOLDER + "polyfills.ts", polyfillsFile)); @@ -47,6 +54,6 @@ export class SharedAssetsGenerator { files.push(new LiveEditingFile(SAMPLE_APP_FOLDER + "app.component.ts", args.appComponentTsFileContent)); let sharedFile = new SharedAssetsFile(files, new DevDependencyResolver().devDependencies); - fs.writeFileSync(this.sampleAssetsDir + "shared.json", JSON.stringify(sharedFile)); + fs.writeFileSync(this.options.samplesDir + "shared.json", JSON.stringify(sharedFile)); } } diff --git a/src/generators/misc/SharedAssetsGeneratorArgs.ts b/src/generators/misc/SharedAssetsGeneratorArgs.ts index ec49848..ef9f883 100644 --- a/src/generators/misc/SharedAssetsGeneratorArgs.ts +++ b/src/generators/misc/SharedAssetsGeneratorArgs.ts @@ -5,15 +5,17 @@ export class SharedAssetsGeneratorArgs { public appComponentStylesFileName: string; public appComponentStylesFileContent: string; public appComponentTsFileContent: string; + public additionalStyles: string[]; constructor(stylesFileName: string, stylesFileContent: string, angularJsonFilePath: string, appComponentStylesFileName: string, - appComponentStylesFileContent: string, appComponentTsFileContent: string) { + appComponentStylesFileContent: string, appComponentTsFileContent: string, additionalStyles?: string[]) { this.stylesFileName = stylesFileName; this.stylesFileContent = stylesFileContent; this.angularJsonFilePath = angularJsonFilePath; this.appComponentStylesFileName = appComponentStylesFileName; this.appComponentStylesFileContent = appComponentStylesFileContent; this.appComponentTsFileContent = appComponentTsFileContent; + this.additionalStyles = additionalStyles; } } diff --git a/src/public.ts b/src/public.ts index 3da8227..7b73e89 100644 --- a/src/public.ts +++ b/src/public.ts @@ -81,5 +81,6 @@ export interface ILiveEditingOptions { routerPath:string, moduleName?: string }; + additionalSharedStyles?:string[]; }