javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-15 19:26:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: Register ./app.css instead of app.css so it can be provided by webpack context (#5158)

Browse Source 
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.
This commit is contained in:
Panayot Cankov
2017-12-12 14:34:38 +02:00
committed by GitHub
parent 699e6f5da8
commit d356339520
2 changed files with 15 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
tns-core-modules/application/application-common.ts
View File

@ -30,7 +30,7 @@ export const lowMemoryEvent = "lowMemory";
export const uncaughtErrorEvent = "uncaughtError"; export const uncaughtErrorEvent = "uncaughtError";
export const orientationChangedEvent = "orientationChanged"; export const orientationChangedEvent = "orientationChanged";
let cssFile: string = "app.css"; let cssFile: string = "./app.css";
let resources: any = {}; let resources: any = {};

18
tns-core-modules/globals/globals.ts
View File

@ -42,20 +42,30 @@ interface ExtensionMap {
[originalFileExtension: string]: string; [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 = {}) { global.registerWebpackModules = function registerWebpackModules(context: Context, extensionMap: ExtensionMap = {}) {
context.keys().forEach(key => { context.keys().forEach(key => {
const extDotIndex = key.lastIndexOf("."); const extDotIndex = key.lastIndexOf(".");
const base = key.substr(0, extDotIndex); const base = key.substr(0, extDotIndex);
const originalExt = key.substr(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; const registerName = base + registerExt;
if (registerName.startsWith("./") && registerName.endsWith(".js")) { if (registerName.startsWith("./") && registerName.endsWith(".js")) {
const jsNickName = registerName.substr(2, registerName.length - 5); 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); // 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));
}); });
} }