Home / File/ index.js — svelte Source File

index.js — svelte Source File

Architecture documentation for index.js, a javascript file in the svelte codebase. 15 imports, 1 dependents.

File javascript Compiler Transformer 15 imports 1 dependents 2 functions

Entity Profile

Dependency Diagram

graph LR
  f1cb032f_d7a0_6877_cebc_2e5f4505e958["index.js"]
  c9396417_dc03_f85c_9f6a_3664daebcdd5["version.js"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> c9396417_dc03_f85c_9f6a_3664daebcdd5
  86cf8685_38fa_3a1c_9b81_21c452968289["transform-server.js"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> 86cf8685_38fa_3a1c_9b81_21c452968289
  b507285b_8f11_234a_936c_682b2ac1e15b["server_component"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> b507285b_8f11_234a_936c_682b2ac1e15b
  c54f6fdd_cd90_f775_fe11_a4c398d8d8e5["server_module"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> c54f6fdd_cd90_f775_fe11_a4c398d8d8e5
  7665e008_f37d_b860_a594_f2539a66af4e["transform-client.js"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> 7665e008_f37d_b860_a594_f2539a66af4e
  662808dd_8096_e53e_2dc5_8a5903c50472["client_component"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> 662808dd_8096_e53e_2dc5_8a5903c50472
  f67152db_9574_dae2_c7ba_381253877c55["client_module"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> f67152db_9574_dae2_c7ba_381253877c55
  194b07ed_c18e_6587_618d_b4b4d02442e0["index.js"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> 194b07ed_c18e_6587_618d_b4b4d02442e0
  1129e6de_ad88_9249_cdc1_424cf9bba55e["render_stylesheet"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> 1129e6de_ad88_9249_cdc1_424cf9bba55e
  d383a41d_5383_ee86_cab6_03bf1a2daf93["mapped_code.js"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> d383a41d_5383_ee86_cab6_03bf1a2daf93
  cbb1ee69_356b_2015_1118_b75b5cb5088f["merge_with_preprocessor_map"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> cbb1ee69_356b_2015_1118_b75b5cb5088f
  8164d272_5d30_264a_68d0_0339d7d146e1["get_source_name"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> 8164d272_5d30_264a_68d0_0339d7d146e1
  62f818c8_e890_17ed_5ec1_92f953d4a7a6["state.js"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> 62f818c8_e890_17ed_5ec1_92f953d4a7a6
  16640ae7_e3c7_97fb_f758_13b5051448f7["esrap"]
  f1cb032f_d7a0_6877_cebc_2e5f4505e958 --> 16640ae7_e3c7_97fb_f758_13b5051448f7
  style f1cb032f_d7a0_6877_cebc_2e5f4505e958 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

/** @import { Node } from 'esrap/languages/ts' */
/** @import { ValidatedCompileOptions, CompileResult, ValidatedModuleCompileOptions } from '#compiler' */
/** @import { ComponentAnalysis, Analysis } from '../types' */
import { print } from 'esrap';
import ts from 'esrap/languages/ts';
import { VERSION } from '../../../version.js';
import { server_component, server_module } from './server/transform-server.js';
import { client_component, client_module } from './client/transform-client.js';
import { render_stylesheet } from './css/index.js';
import { merge_with_preprocessor_map, get_source_name } from '../../utils/mapped_code.js';
import * as state from '../../state.js';

/**
 * @param {ComponentAnalysis} analysis
 * @param {string} source
 * @param {ValidatedCompileOptions} options
 * @returns {CompileResult}
 */
export function transform_component(analysis, source, options) {
	if (options.generate === false) {
		return {
			js: /** @type {any} */ (null),
			css: null,
			warnings: state.warnings, // set afterwards
			metadata: {
				runes: analysis.runes
			},
			ast: /** @type {any} */ (null) // set afterwards
		};
	}

	const program =
		options.generate === 'server'
			? server_component(analysis, options)
			: client_component(analysis, options);

	const js_source_name = get_source_name(options.filename, options.outputFilename, 'input.svelte');

	const js = print(/** @type {Node} */ (program), ts({ comments: analysis.comments }), {
		// include source content; makes it easier/more robust looking up the source map code
		// (else esrap does return null for source and sourceMapContent which may trip up tooling)
		sourceMapContent: source,
		sourceMapSource: js_source_name
	});

	merge_with_preprocessor_map(js, options, js_source_name);

	const css =
		analysis.css.ast && !analysis.inject_styles
			? render_stylesheet(source, analysis, options)
			: null;

	return {
		js,
		css,
		warnings: state.warnings, // set afterwards. TODO apply preprocessor sourcemap
		metadata: {
			runes: analysis.runes
		},
		ast: /** @type {any} */ (null) // set afterwards
	};
}

/**
 * @param {Analysis} analysis
 * @param {string} source
 * @param {ValidatedModuleCompileOptions} options
 * @returns {CompileResult}
 */
export function transform_module(analysis, source, options) {
	if (options.generate === false) {
		return {
			js: /** @type {any} */ (null),
			css: null,
			warnings: state.warnings, // set afterwards
			metadata: {
				runes: true
			},
			ast: /** @type {any} */ (null) // set afterwards
		};
	}

	const program =
		options.generate === 'server'
			? server_module(analysis, options)
			: client_module(analysis, options);

	const basename = options.filename.split(/[/\\]/).at(-1);
	if (program.body.length > 0) {
		program.body[0].leadingComments = [
			{
				type: 'Block',
				value: ` ${basename} generated by Svelte v${VERSION} `
			}
		];
	}

	const js = print(/** @type {Node} */ (program), ts({ comments: analysis.comments }), {
		// include source content; makes it easier/more robust looking up the source map code
		// (else esrap does return null for source and sourceMapContent which may trip up tooling)
		sourceMapContent: source,
		sourceMapSource: get_source_name(options.filename, undefined, 'input.svelte.js')
	});

	// prepend comment
	js.code = `/* ${basename} generated by Svelte v${VERSION} */\n${js.code}`;
	js.map.mappings = ';' + js.map.mappings;

	return {
		js,
		css: null,
		metadata: {
			runes: true
		},
		warnings: state.warnings, // set afterwards
		ast: /** @type {any} */ (null) // set afterwards
	};
}

Domain

Subdomains

Frequently Asked Questions

What does index.js do?
index.js is a source file in the svelte codebase, written in javascript. It belongs to the Compiler domain, Transformer subdomain.
What functions are defined in index.js?
index.js defines 2 function(s): transform_component, transform_module.
What does index.js depend on?
index.js imports 15 module(s): client_component, client_module, esrap, get_source_name, index.js, mapped_code.js, merge_with_preprocessor_map, render_stylesheet, and 7 more.
What files import index.js?
index.js is imported by 1 file(s): index.js.
Where is index.js in the architecture?
index.js is located at packages/svelte/src/compiler/phases/3-transform/index.js (domain: Compiler, subdomain: Transformer, directory: packages/svelte/src/compiler/phases/3-transform).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free