mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-11-20 11:36:24 +01:00
Support dark mode and remove dev script tag
This commit is contained in:
parent
0a95eb0940
commit
743bd0db1c
@ -111,6 +111,7 @@ module.exports = function buildThemes(options) {
|
|||||||
},
|
},
|
||||||
|
|
||||||
async buildStart() {
|
async buildStart() {
|
||||||
|
if (isDevelopment) { return; }
|
||||||
const { manifestLocations } = options;
|
const { manifestLocations } = options;
|
||||||
for (const location of manifestLocations) {
|
for (const location of manifestLocations) {
|
||||||
manifest = require(`${location}/manifest.json`);
|
manifest = require(`${location}/manifest.json`);
|
||||||
@ -130,7 +131,7 @@ module.exports = function buildThemes(options) {
|
|||||||
// emit the css as built theme bundle
|
// emit the css as built theme bundle
|
||||||
this.emitFile({
|
this.emitFile({
|
||||||
type: "chunk",
|
type: "chunk",
|
||||||
id: `${location}/theme.css?variant=${variant}`,
|
id: `${location}/theme.css?variant=${variant}${details.dark? "&dark=true": ""}`,
|
||||||
fileName,
|
fileName,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -145,7 +146,7 @@ module.exports = function buildThemes(options) {
|
|||||||
|
|
||||||
resolveId(id) {
|
resolveId(id) {
|
||||||
if (id.startsWith(virtualModuleId)) {
|
if (id.startsWith(virtualModuleId)) {
|
||||||
return isDevelopment? '\0' + id: false;
|
return '\0' + id;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -165,7 +166,9 @@ module.exports = function buildThemes(options) {
|
|||||||
switch (file) {
|
switch (file) {
|
||||||
case "index.js": {
|
case "index.js": {
|
||||||
const location = findLocationFromThemeName(theme, options.manifestLocations);
|
const location = findLocationFromThemeName(theme, options.manifestLocations);
|
||||||
return `import "${path.resolve(`${location}/theme.css`)}";` +
|
const manifest = findManifestFromThemeName(theme, options.manifestLocations);
|
||||||
|
const isDark = manifest.values.variants[variant].dark;
|
||||||
|
return `import "${path.resolve(`${location}/theme.css`)}${isDark? "?dark=true": ""}";` +
|
||||||
`import "@theme/${theme}/${variant}/variables.css"`;
|
`import "@theme/${theme}/${variant}/variables.css"`;
|
||||||
}
|
}
|
||||||
case "variables.css": {
|
case "variables.css": {
|
||||||
@ -178,7 +181,7 @@ module.exports = function buildThemes(options) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
const result = id.match(/(.+)\/theme.css\?variant=(.+)/);
|
const result = id.match(/(.+)\/theme.css\?variant=([^&]+)/);
|
||||||
if (result) {
|
if (result) {
|
||||||
const [, location, variant] = result;
|
const [, location, variant] = result;
|
||||||
const cssSource = await readCSSSource(location);
|
const cssSource = await readCSSSource(location);
|
||||||
@ -189,6 +192,18 @@ module.exports = function buildThemes(options) {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
transform(code, id) {
|
||||||
|
if (isDevelopment) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// Removes develop-only script tag; this cannot be done in transformIndexHtml hook.
|
||||||
|
const devScriptTag = /<script type="module"> import "@theme\/.+"; <\/script>/;
|
||||||
|
if (id.endsWith("index.html")) {
|
||||||
|
const htmlWithoutDevScript = code.replace(devScriptTag, "");
|
||||||
|
return htmlWithoutDevScript
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
transformIndexHtml(_, ctx) {
|
transformIndexHtml(_, ctx) {
|
||||||
if (isDevelopment) {
|
if (isDevelopment) {
|
||||||
// Don't add default stylesheets to index.html on dev
|
// Don't add default stylesheets to index.html on dev
|
||||||
@ -223,7 +238,7 @@ module.exports = function buildThemes(options) {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
},
|
},
|
||||||
|
|
||||||
generateBundle(_, bundle) {
|
generateBundle(_, bundle) {
|
||||||
const { assetMap, chunkMap, runtimeThemeChunk } = parseBundle(bundle);
|
const { assetMap, chunkMap, runtimeThemeChunk } = parseBundle(bundle);
|
||||||
|
Loading…
Reference in New Issue
Block a user