From d3563395201d045cd6e47b6786ff88dd446eabd2 Mon Sep 17 00:00:00 2001 From: Panayot Cankov Date: Tue, 12 Dec 2017 14:34:38 +0200 Subject: [PATCH] feat: Register ./app.css instead of app.css so it can be provided by webpack context (#5158) This will let us register the app.css in webpack from a context, and potentially have a configuration such as: ``` const appCssContext = require.context("~/", false, /^\.\/app\.(css|scss|less|sass)$/); global.registerWebpackModules(appCssContext); ``` That will work with all of the app.css, app.scss, app.less etc. without further manual reconfiguration. --- .../application/application-common.ts | 2 +- tns-core-modules/globals/globals.ts | 18 ++++++++++++++---- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/tns-core-modules/application/application-common.ts b/tns-core-modules/application/application-common.ts index 71149331c..58c6f0ae2 100644 --- a/tns-core-modules/application/application-common.ts +++ b/tns-core-modules/application/application-common.ts @@ -30,7 +30,7 @@ export const lowMemoryEvent = "lowMemory"; export const uncaughtErrorEvent = "uncaughtError"; export const orientationChangedEvent = "orientationChanged"; -let cssFile: string = "app.css"; +let cssFile: string = "./app.css"; let resources: any = {}; diff --git a/tns-core-modules/globals/globals.ts b/tns-core-modules/globals/globals.ts index 9e31f7b11..3e18ce463 100644 --- a/tns-core-modules/globals/globals.ts +++ b/tns-core-modules/globals/globals.ts @@ -42,20 +42,30 @@ interface ExtensionMap { [originalFileExtension: string]: string; } -const defaultExtensionMap = { ".js": ".js", ".ts": ".js", ".css": ".css", ".scss": ".css", ".xml": ".xml" }; +const defaultExtensionMap = { ".js": ".js", ".ts": ".js", ".css": ".css", ".scss": ".css", ".xml": ".xml", ".less": ".css", ".sass": ".css" }; global.registerWebpackModules = function registerWebpackModules(context: Context, extensionMap: ExtensionMap = {}) { context.keys().forEach(key => { const extDotIndex = key.lastIndexOf("."); const base = key.substr(0, extDotIndex); const originalExt = key.substr(extDotIndex); - const registerExt = extensionMap[originalExt] || defaultExtensionMap[originalExt]; + const registerExt = extensionMap[originalExt] || defaultExtensionMap[originalExt] || originalExt; + + // We prefer source files for webpack scenarios before compilation leftovers, + // e. g. if we get a .js and .ts for the same module, the .js is probably the compiled version of the .ts file, + // so we register the .ts with higher priority, similar is the case with us preferring the .scss to .css + const isSourceFile = originalExt !== registerExt; + const registerName = base + registerExt; if (registerName.startsWith("./") && registerName.endsWith(".js")) { const jsNickName = registerName.substr(2, registerName.length - 5); // This is extremely short version like "main-page" that was promoted to be used with global.registerModule("module-name", loaderFunc); - global.registerModule(jsNickName, () => context(key)); + if (isSourceFile || !global.moduleExists(jsNickName)) { + global.registerModule(jsNickName, () => context(key)); + } + } + if (isSourceFile || !global.moduleExists(registerName)) { + global.registerModule(registerName, () => context(key)); } - global.registerModule(registerName, () => context(key)); }); }