msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

use @foo for generator.alias("foo")

Browse Source
pull/673/head
Rich Harris 8 years ago
parent c8e396730b
commit 9feee3a0bf
9 changed files with 40 additions and 65 deletions
Show Stats Download Patch File Download Diff File

71
src/generators/dom/index.ts
Unescape View File

@ -16,7 +16,6 @@ const helperPattern = new RegExp(`@(${Object.keys(shared).join('|')})\\b`, 'g');
export class DomGenerator extends Generator {
blocks: Block[];
uses: Set<string>;
readonly: Set<string>;
metaBindings: string[];
@ -34,7 +33,6 @@ export class DomGenerator extends Generator {
) {
super(parsed, source, name, options);
this.blocks = [];
this.uses = new Set();
this.readonly = new Set();
@ -43,16 +41,6 @@ export class DomGenerator extends Generator {
// initial values for e.g. window.innerWidth, if there's a <:Window> meta tag
this.metaBindings = [];
}
helper(name: string) {
if (this.options.dev && `${name}Dev` in shared) {
name = `${name}Dev`;
}
this.uses.add(name);
return this.alias(name);
}
}
export default function dom(
@ -99,17 +87,13 @@ export default function dom(
`( '${dep}' in newState && @differs( state.${dep}, oldState.${dep} ) )`
)
.join(' || ')}`;
const statement = `state.${key} = newState.${key} = ${generator.alias(
'template'
)}.computed.${key}( ${deps.map(dep => `state.${dep}`).join(', ')} );`;
const statement = `state.${key} = newState.${key} = @template.computed.${key}( ${deps.map(dep => `state.${dep}`).join(', ')} );`;
computationBuilder.addConditionalLine(condition, statement);
});
builder.addBlock(deindent`
function ${generator.alias(
'recompute'
)} ( state, newState, oldState, isInitial ) {
function @recompute ( state, newState, oldState, isInitial ) {
${computationBuilder}
}
`);
@ -130,10 +114,7 @@ export default function dom(
var oldState = this._state;
this._state = @assign( {}, oldState, newState );
${computations.length &&
`${generator.alias(
'recompute'
)}( this._state, newState, oldState, false )`}
${computations.length && `@recompute( this._state, newState, oldState, false )`}
@dispatchObservers( this, this._observers.pre, newState, oldState );
${block.hasUpdateMethod && `this._fragment.update( newState, this._state );`}
@dispatchObservers( this, this._observers.post, newState, oldState );
@ -151,9 +132,9 @@ export default function dom(
if (generator.css && options.css !== false) {
builder.addBlock(deindent`
function ${generator.alias('add_css')} () {
function @add_css () {
var style = @createElement( 'style' );
style.id = ${JSON.stringify(generator.cssId + '-style')};
style.id = '${generator.cssId}-style';
style.textContent = ${JSON.stringify(generator.css)};
@appendNode( style, document.head );
}
@ -171,14 +152,14 @@ export default function dom(
const prototypeBase =
`${name}.prototype` +
(templateProperties.methods
? `, ${generator.alias('template')}.methods`
? `, @template.methods`
: '');
const proto = sharedPath
? `@proto `
: deindent`
{
${['get', 'fire', 'observe', 'on', 'set', '_flush']
.map(n => `${n}: ${generator.helper(n)}`)
.map(n => `${n}: @${n}`)
.join(',\n')}
}`;
@ -190,15 +171,11 @@ export default function dom(
`if ( !options.target && !options._root ) throw new Error( "'target' is a required option" );`}
${generator.usesRefs && `this.refs = {};`}
this._state = ${templateProperties.data
? `@assign( ${generator.alias(
'template'
)}.data(), options.data )`
? `@assign( @template.data(), options.data )`
: `options.data || {}`};
${generator.metaBindings}
${computations.length &&
`${generator.alias(
'recompute'
)}( this._state, this._state, {}, true );`}
`@recompute( this._state, this._state, {}, true );`}
${options.dev &&
Array.from(generator.expectedProperties).map(
prop =>
@ -224,14 +201,12 @@ export default function dom(
options.css !== false &&
`if ( !document.getElementById( ${JSON.stringify(
generator.cssId + '-style'
)} ) ) ${generator.alias('add_css')}();`}
)} ) ) @add_css();`}
${(generator.hasComponents || generator.hasIntroTransitions) &&
`this._renderHooks = [];`}
${generator.hasComplexBindings && `this._bindings = [];`}
this._fragment = ${generator.alias(
'create_main_fragment'
)}( this._state, this );
this._fragment = @create_main_fragment( this._state, this );
if ( options.target ) {
${generator.hydratable ?
@ -254,11 +229,9 @@ export default function dom(
${templateProperties.oncreate &&
deindent`
if ( options._root ) {
options._root._renderHooks.push( ${generator.alias(
'template'
)}.oncreate.bind( this ) );
options._root._renderHooks.push( @template.oncreate.bind( this ) );
} else {
${generator.alias('template')}.oncreate.call( this );
@template.oncreate.call( this );
}
`}
}
@ -272,7 +245,7 @@ export default function dom(
${name}.prototype.teardown = ${name}.prototype.destroy = function destroy ( detach ) {
this.fire( 'destroy' );
${templateProperties.ondestroy &&
`${generator.alias('template')}.ondestroy.call( this );`}
`@template.ondestroy.call( this );`}
if ( detach !== false ) this._fragment.unmount();
this._fragment.destroy();
@ -283,8 +256,16 @@ export default function dom(
};
`);
const usedHelpers = new Set();
let result = builder.toString()
.replace(helperPattern, (match: string, name: string) => generator.helper(name));
.replace(/@(\w+)\b/g, (match: string, name: string) => {
if (name in shared) {
if (options.dev && `${name}Dev` in shared) name = `${name}Dev`;
usedHelpers.add(name);
}
return generator.alias(name);
});
if (sharedPath) {
if (format !== 'es') {
@ -293,7 +274,7 @@ export default function dom(
);
}
const names = Array.from(generator.uses).sort().map(name => {
const names = Array.from(usedHelpers).sort().map(name => {
return name !== generator.alias(name)
? `${name} as ${generator.alias(name)}`
: name;
@ -301,7 +282,7 @@ export default function dom(
result = `import { ${names.join(', ')} } from ${JSON.stringify(sharedPath)};\n\n` + result;
} else {
generator.uses.forEach(key => {
usedHelpers.forEach(key => {
const str = shared[key];
const code = new MagicString(str);
const expression = parseExpressionAt(str, 0);
@ -320,7 +301,7 @@ export default function dom(
if (node.name in shared) {
// this helper function depends on another one
const dependency = node.name;
generator.uses.add(dependency);
usedHelpers.add(dependency);
const alias = generator.alias(dependency);
if (alias !== node.name)

2
src/generators/dom/preprocess.ts
Unescape View File

@ -382,7 +382,7 @@ export default function preprocess(
) {
const block = new Block({
generator,
name: generator.alias('create_main_fragment'),
name: '@create_main_fragment',
key: null,
contexts: new Map(),

2
src/generators/dom/visitors/Component/Component.ts
Unescape View File

@ -184,7 +184,7 @@ export default function visitComponent(
const expression = node.name === ':Self'
? generator.name
: generator.importedComponents.get(node.name) ||
`${generator.alias('template')}.components.${node.name}`;
`@template.components.${node.name}`;
local.create.addBlockAtStart(deindent`
${statements.join('\n')}

4
src/generators/dom/visitors/Element/EventHandler.ts
Unescape View File

@ -72,9 +72,7 @@ export default function visitEventHandler(
block.addVariable(handlerName);
block.builders.hydrate.addBlock(deindent`
${handlerName} = ${generator.alias(
'template'
)}.events.${name}.call( ${block.component}, ${state.parentNode}, function ( event ) {
${handlerName} = @template.events.${name}.call( ${block.component}, ${state.parentNode}, function ( event ) {
${handlerBody}
});
`);

6
src/generators/dom/visitors/Element/addTransitions.ts
Unescape View File

@ -20,7 +20,7 @@ export default function addTransitions(
block.addVariable(name);
const fn = `${generator.alias('template')}.transitions.${intro.name}`;
const fn = `@template.transitions.${intro.name}`;
block.builders.intro.addBlock(deindent`
${block.component}._renderHooks.push( function () {
@ -48,7 +48,7 @@ export default function addTransitions(
? block.contextualise(intro.expression).snippet
: '{}';
const fn = `${generator.alias('template')}.transitions.${intro.name}`; // TODO add built-in transitions?
const fn = `@template.transitions.${intro.name}`; // TODO add built-in transitions?
if (outro) {
block.builders.intro.addBlock(deindent`
@ -73,7 +73,7 @@ export default function addTransitions(
? block.contextualise(outro.expression).snippet
: '{}';
const fn = `${generator.alias('template')}.transitions.${outro.name}`;
const fn = `@template.transitions.${outro.name}`;
// TODO hide elements that have outro'd (unless they belong to a still-outroing
// group) prior to their removal from the DOM

14
src/generators/server-side-rendering/index.ts
Unescape View File

@ -59,22 +59,18 @@ export default function ssr(
${name}.data = function () {
return ${templateProperties.data
? `${generator.alias('template')}.data()`
? `@template.data()`
: `{}`};
};
${name}.render = function ( state, options ) {
${templateProperties.data
? `state = Object.assign( ${generator.alias(
'template'
)}.data(), state || {} );`
? `state = Object.assign( @template.data(), state || {} );`
: `state = state || {};`}
${computations.map(
({ key, deps }) =>
`state.${key} = ${generator.alias(
'template'
)}.computed.${key}( ${deps.map(dep => `state.${dep}`).join(', ')} );`
`state.${key} = @template.computed.${key}( ${deps.map(dep => `state.${dep}`).join(', ')} );`
)}
${generator.bindings.length &&
@ -121,7 +117,7 @@ export default function ssr(
const { name } = prop.key;
const expression =
generator.importedComponents.get(name) ||
`${generator.alias('template')}.components.${name}`;
`@template.components.${name}`;
return `addComponent( ${expression} );`;
})}
`}
@ -144,7 +140,7 @@ export default function ssr(
function __escape ( html ) {
return String( html ).replace( /["'&<>]/g, match => escaped[ match ] );
}
`;
`.replace(/@(\w+)/g, (match, name) => generator.alias(name));
return generator.generate(result, options, { name, format });
}

2
src/generators/server-side-rendering/visitors/Component.ts
Unescape View File

@ -68,7 +68,7 @@ export default function visitComponent(
const expression = node.name === ':Self'
? generator.name
: generator.importedComponents.get(node.name) ||
`${generator.alias('template')}.components.${node.name}`;
`@template.components.${node.name}`;
bindings.forEach(binding => {
block.addBinding(binding, expression);

2
test/js/samples/collapses-text-around-comments/expected-bundle.js
Unescape View File

@ -145,7 +145,7 @@ var template = (function () {
function add_css () {
var style = createElement( 'style' );
style.id = "svelte-3842350206-style";
style.id = 'svelte-3842350206-style';
style.textContent = "\n\tp[svelte-3842350206], [svelte-3842350206] p {\n\t\tcolor: red;\n\t}\n";
appendNode( style, document.head );
}

2
test/js/samples/collapses-text-around-comments/expected.js
Unescape View File

@ -10,7 +10,7 @@ var template = (function () {
function add_css () {
var style = createElement( 'style' );
style.id = "svelte-3842350206-style";
style.id = 'svelte-3842350206-style';
style.textContent = "\n\tp[svelte-3842350206], [svelte-3842350206] p {\n\t\tcolor: red;\n\t}\n";
appendNode( style, document.head );
}

Write Preview
Loading…
Cancel
Save