Skip to content

Commit

Permalink
fix(labs): Better handling and visibility of q-insights.json
Browse files Browse the repository at this point in the history
  • Loading branch information
@mhevery
mhevery committed Nov 1, 2023
1 parent cf50740 commit 336aeeb
Show file tree
Hide file tree
Showing 5 changed files with 98 additions and 40 deletions.
12 changes: 12 additions & 0 deletions packages/docs/vite.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,18 @@ export default defineConfig(async () => {
Inspect(),
qwikInsights({ publicApiKey: loadEnv('', '.', '').PUBLIC_QWIK_INSIGHTS_KEY }),
],
build: {
rollupOptions: {
onLog(level, log, defaultHandler) {
if (level == 'warn' && log.code === 'MODULE_LEVEL_DIRECTIVE') {
// Suppress errors like these:
// FILE Module level directives cause errors when bundled, "use client" in FILE was ignored.
return;
}
defaultHandler(level, log);
},
},
},
clearScreen: false,
server: {
port: 3000,
Expand Down
4 changes: 2 additions & 2 deletions packages/qwik-city/buildtime/vite/plugin.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -256,15 +256,15 @@ function qwikCityPlugin(userOpts?: QwikCityVitePluginOptions): any {
closeBundle: {
sequential: true,
async handler() {
if (ctx?.target === 'ssr') {
if (ctx?.target === 'ssr' && !ctx?.isDevServer) {
// ssr build
const manifest = qwikPlugin!.api.getManifest();
const clientOutDir = qwikPlugin!.api.getClientOutDir();
const insightsManifest = await qwikPlugin!.api.getInsightsManifest(clientOutDir);

if (manifest && clientOutDir) {
const basePathRelDir = api.getBasePathname().replace(/^\/|\/$/, '');
const clientOutBaseDir = join(clientOutDir, basePathRelDir);
const insightsManifest = await qwikPlugin!.api.getInsightsManifest(clientOutDir);

for (const swEntry of ctx.serviceWorkers) {
try {
Expand Down
13 changes: 11 additions & 2 deletions packages/qwik-labs/src-vite/insights/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,13 @@ import { join } from 'node:path';
import { PluginOption } from 'vite';

const logWarn = (message?: any) => {
console.warn('\x1b[33m%s\x1b[0m', `\n\nQWIK WARN: ${message}\n`);
// eslint-disable-next-line no-console
console.warn('\x1b[33m%s\x1b[0m', `qwikInsight()[WARN]: ${message}`);
};

const log = (message?: any) => {
// eslint-disable-next-line no-console
console.log('\x1b[35m%s\x1b[0m', `qwikInsight(): ${message}`);
};

export async function qwikInsights(qwikInsightsOpts: {
Expand All @@ -22,6 +28,7 @@ export async function qwikInsights(qwikInsightsOpts: {
const vitePlugin: PluginOption = {
name: 'vite-plugin-qwik-insights',
enforce: 'pre',
apply: 'build',
async config(viteConfig) {
isProd = viteConfig.mode !== 'ssr';
if (isProd) {
Expand All @@ -36,7 +43,9 @@ export async function qwikInsights(qwikInsightsOpts: {
if (!existsSync(join(process.cwd(), outDir))) {
mkdirSync(join(process.cwd(), outDir), { recursive: true });
}
await writeFile(join(process.cwd(), outDir, 'q-insights.json'), JSON.stringify(qManifest));
const cwdRelativePath = join(viteConfig.root || '.', outDir, 'q-insights.json');
log('Fetched latest Qwik Insight data into: ' + cwdRelativePath);
await writeFile(join(process.cwd(), cwdRelativePath), JSON.stringify(qManifest));
}
},
closeBundle: async () => {
Expand Down
44 changes: 25 additions & 19 deletions packages/qwik/src/optimizer/src/plugins/plugin.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -304,7 +304,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
};

const buildStart = async (ctx: any) => {
log(`buildStart()`, opts.buildMode, opts.scope);
debug(`buildStart()`, opts.buildMode, opts.scope);
const optimizer = getOptimizer();

if (optimizer.sys.env === 'node' && opts.target === 'ssr') {
Expand All @@ -322,7 +322,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
let srcDir = '/';
if (typeof opts.srcDir === 'string') {
srcDir = normalizePath(opts.srcDir);
log(`buildStart() srcDir`, opts.srcDir);
debug(`buildStart() srcDir`, opts.srcDir);
} else if (Array.isArray(opts.srcInputs)) {
optimizer.sys.getInputFiles = async (rootDir) =>
opts.srcInputs!.map((i) => {
Expand All @@ -332,14 +332,14 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
};
return relInput;
});
log(`buildStart() opts.srcInputs (${opts.srcInputs.length})`);
debug(`buildStart() opts.srcInputs (${opts.srcInputs.length})`);
}
const vendorRoots = opts.vendorRoots;
if (vendorRoots.length > 0) {
log(`vendorRoots`, vendorRoots);
debug(`vendorRoots`, vendorRoots);
}

log(`transformedOutput.clear()`);
debug(`transformedOutput.clear()`);
transformedOutputs.clear();

const mode =
Expand Down Expand Up @@ -372,7 +372,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
const result = await optimizer.transformFs(transformOpts);
for (const output of result.modules) {
const key = normalizePath(path.join(srcDir, output.path)!);
log(`buildStart() add transformedOutput`, key, output.hook?.displayName);
debug(`buildStart() add transformedOutput`, key, output.hook?.displayName);
transformedOutputs.set(key, [output, key]);
ssrTransformedOutputs.set(key, [output, key]);
if (output.hook) {
Expand All @@ -398,7 +398,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
importer: string | undefined,
ssrOpts?: { ssr?: boolean }
) => {
log(`resolveId()`, 'Start', id, importer);
debug(`resolveId()`, 'Start', id, importer);

if (id.startsWith('\0')) {
return;
Expand All @@ -414,15 +414,15 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
}

if (opts.resolveQwikBuild && id.endsWith(QWIK_BUILD_ID)) {
log(`resolveId()`, 'Resolved', QWIK_BUILD_ID);
debug(`resolveId()`, 'Resolved', QWIK_BUILD_ID);
return {
id: normalizePath(getPath().resolve(opts.rootDir, QWIK_BUILD_ID)),
moduleSideEffects: false,
};
}

if (id.endsWith(QWIK_CLIENT_MANIFEST_ID)) {
log(`resolveId()`, 'Resolved', QWIK_CLIENT_MANIFEST_ID);
debug(`resolveId()`, 'Resolved', QWIK_CLIENT_MANIFEST_ID);
if (opts.target === 'lib') {
return {
id: id,
Expand All @@ -449,7 +449,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
const ext = path.extname(importeePathId).toLowerCase();
if (ext in RESOLVE_EXTS) {
importer = normalizePath(importer);
log(`resolveId("${importeePathId}", "${importer}")`);
debug(`resolveId("${importeePathId}", "${importer}")`);
const parsedImporterId = parseId(importer);
const dir = path.dirname(parsedImporterId.pathId);
if (parsedImporterId.pathId.endsWith('.html') && !importeePathId.endsWith('.html')) {
Expand All @@ -462,7 +462,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
: transformedOutputs.get(importeePathId);

if (transformedOutput) {
log(`resolveId() Resolved ${importeePathId} from transformedOutputs`);
debug(`resolveId() Resolved ${importeePathId} from transformedOutputs`);
return {
id: importeePathId + parsedId.query,
};
Expand All @@ -473,13 +473,13 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
const importeePathId = normalizePath(parsedId.pathId);
const ext = path.extname(importeePathId).toLowerCase();
if (ext in RESOLVE_EXTS) {
log(`resolveId("${importeePathId}", "${importer}")`);
debug(`resolveId("${importeePathId}", "${importer}")`);
const transformedOutput = isSSR
? ssrTransformedOutputs.get(importeePathId)
: transformedOutputs.get(importeePathId);

if (transformedOutput) {
log(`resolveId() Resolved ${importeePathId} from transformedOutputs`);
debug(`resolveId() Resolved ${importeePathId} from transformedOutputs`);
return {
id: importeePathId + parsedId.query,
};
Expand All @@ -495,15 +495,15 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
}
const isSSR = ssrOpts?.ssr ?? opts.target === 'ssr';
if (opts.resolveQwikBuild && id.endsWith(QWIK_BUILD_ID)) {
log(`load()`, QWIK_BUILD_ID, opts.buildMode);
debug(`load()`, QWIK_BUILD_ID, opts.buildMode);
return {
moduleSideEffects: false,
code: getQwikBuildModule(isSSR, opts.target),
};
}

if (id.endsWith(QWIK_CLIENT_MANIFEST_ID)) {
log(`load()`, QWIK_CLIENT_MANIFEST_ID, opts.buildMode);
debug(`load()`, QWIK_CLIENT_MANIFEST_ID, opts.buildMode);
return {
moduleSideEffects: false,
code: await getQwikServerManifestModule(isSSR),
Expand All @@ -516,7 +516,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
const transformedModule = isSSR ? ssrTransformedOutputs.get(id) : transformedOutputs.get(id);

if (transformedModule) {
log(`load()`, 'Found', id);
debug(`load()`, 'Found', id);

let code = transformedModule[0].code;
if (opts.target === 'ssr') {
Expand Down Expand Up @@ -568,7 +568,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
) {
const strip = opts.target === 'client' || opts.target === 'ssr';
const normalizedID = normalizePath(pathId);
log(`transform()`, 'Transforming', pathId);
debug(`transform()`, 'Transforming', pathId);

let filePath = base;
if (opts.srcDir) {
Expand Down Expand Up @@ -697,7 +697,7 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
};
}

log(`transform()`, 'No Transforming', id);
debug(`transform()`, 'No Transforming', id);

return null;
};
Expand Down Expand Up @@ -752,13 +752,18 @@ export function createPlugin(optimizerOptions: OptimizerOptions = {}) {
});
};

const log = (...str: any[]) => {
const debug = (...str: any[]) => {
if (opts.debug) {
// eslint-disable-next-line no-console
console.debug(`[QWIK PLUGIN: ${id}]`, ...str);
}
};

const log = (...str: any[]) => {
// eslint-disable-next-line no-console
console.log(`[QWIK PLUGIN: ${id}]`, ...str);
};

const onDiagnostics = (cb: (d: Diagnostic[], optimizer: Optimizer, srcDir: string) => void) => {
diagnosticsCallback = cb;
};
Expand Down Expand Up @@ -812,6 +817,7 @@ export const manifest = ${JSON.stringify(manifest)};\n`;
getTransformedOutputs,
init,
load,
debug,
log,
normalizeOptions,
normalizePath,
Expand Down
65 changes: 48 additions & 17 deletions packages/qwik/src/optimizer/src/plugins/vite.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import type {
QwikManifest,
TransformModule,
InsightManifest,
Path,
} from '../types';
import { versions } from '../versions';
import { getImageSizeServer } from './image-size-server';
Expand Down Expand Up @@ -57,10 +58,24 @@ export function qwikVite(qwikViteOpts: QwikVitePluginOptions = {}): any {

async function loadQwikInsights(clientOutDir?: string | null): Promise<InsightManifest | null> {
const sys = qwikPlugin.getSys();
const cwdRelativePath = absolutePathAwareJoin(
sys.path,
rootDir || '.',
clientOutDir ?? 'dist',
'q-insights.json'
);
const path = absolutePathAwareJoin(sys.path, process.cwd(), cwdRelativePath);
const fs: typeof import('fs') = await sys.dynamicImport('node:fs');
const path = sys.path.join(process.cwd(), clientOutDir ?? 'dist', 'q-insights.json');
if (fs.existsSync(path)) {
qwikPlugin.log('Reading Qwik Insight data from: ' + cwdRelativePath);
return JSON.parse(await fs.promises.readFile(path, 'utf-8')) as InsightManifest;
} else {
qwikPlugin.log(
'Qwik Insight not found `' +
cwdRelativePath +
'`, skipping.\n' +
'\t\tConsider setting up https://qwik.builder.io/docs/labs/insights/ for better bundle optimization.'
);
}
return null;
}
Expand Down Expand Up @@ -113,20 +128,7 @@ export function qwikVite(qwikViteOpts: QwikVitePluginOptions = {}): any {
viteCommand = viteEnv.command;
isClientDevOnly = viteCommand === 'serve' && viteEnv.mode !== 'ssr';

qwikPlugin.log(`vite config(), command: ${viteCommand}, env.mode: ${viteEnv.mode}`);

if (sys.env === 'node' && !qwikViteOpts.entryStrategy) {
try {
const entryStrategy = await loadQwikInsights(
!qwikViteOpts.csr ? qwikViteOpts.client?.outDir : undefined
);
if (entryStrategy) {
qwikViteOpts.entryStrategy = entryStrategy;
}
} catch (e) {
// ok to ignore
}
}
qwikPlugin.debug(`vite config(), command: ${viteCommand}, env.mode: ${viteEnv.mode}`);

if (viteCommand === 'serve') {
qwikViteOpts.entryStrategy = { type: 'hook' };
Expand Down Expand Up @@ -379,8 +381,21 @@ export function qwikVite(qwikViteOpts: QwikVitePluginOptions = {}): any {
return updatedViteConfig;
},

configResolved(config) {
async configResolved(config) {
basePathname = config.base;
const sys = qwikPlugin.getSys();
if (sys.env === 'node' && !qwikViteOpts.entryStrategy) {
try {
const entryStrategy = await loadQwikInsights(
!qwikViteOpts.csr ? qwikViteOpts.client?.outDir : undefined
);
if (entryStrategy) {
qwikViteOpts.entryStrategy = entryStrategy;
}
} catch (e) {
// ok to ignore
}
}
},

async buildStart() {
Expand Down Expand Up @@ -628,7 +643,7 @@ export function qwikVite(qwikViteOpts: QwikVitePluginOptions = {}): any {
},

handleHotUpdate(ctx) {
qwikPlugin.log('handleHotUpdate()', ctx);
qwikPlugin.debug('handleHotUpdate()', ctx);

for (const mod of ctx.modules) {
const deps = mod.info?.meta?.qwikdeps;
Expand Down Expand Up @@ -902,3 +917,19 @@ export interface QwikViteDevResponse {
_qwikEnvData?: Record<string, any>;
_qwikRenderResolve?: () => void;
}

/**
* Joins path segments together and normalizes the resulting path, taking into account absolute
* paths.
*/
function absolutePathAwareJoin(path: Path, ...segments: string[]): string {
for (let i = segments.length - 1; i >= 0; --i) {
const segment = segments[i];
if (segment.startsWith(path.sep) || segment.indexOf(path.delimiter) !== -1) {
segments.splice(0, i);
break;
}
}
return path.join(...segments);
}

0 comments on commit 336aeeb

Please sign in to comment.