Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add preprocessEmbeddedTemplates function #361

Merged
merged 1 commit into from
Mar 24, 2021
Merged

Conversation

pzuraq
Copy link

@pzuraq pzuraq commented Mar 22, 2021

Adds a function for preprocessing embedded templates. This function finds embedded templates using a simple RegExp + stack based parser which is very limited overall and designed specifically for this purpose. It replaces the embedded templates with parseable JS, and also pre-parses and walks the templates to find all possible identifiers within them and exposes them externally:

class Foo {
  <template>
    <Bar/>

    {{baz}}
  </template>
}

Becomes:

class Foo {
  [GLIMMER_TEMPLATE(`
    <Bar/>

    {{baz}}
  `, { scope: () => ({ Bar, baz }) })];
}

The preprocessor does not understand the surrounding JS scope and so does not know if the identifiers it emits actually exist in scope and are valid (it will only emit valid JS identifiers, however). So, if the preprocessed output is going to be used by another tool, such as a linter, it's up to the user to postprocess the results and remove errors pertaining to this generated code.

The result also includes a list of replacements which let the user know what was replaced in the original template, useful for fixing linting failure locations and so on. Also, it can include and handle sourcemaps.

tsconfig.json Outdated Show resolved Hide resolved
yarn-error.log Outdated Show resolved Hide resolved
Copy link
Member

@rwjblue rwjblue left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Discussed this a bit in discord:

  • Let's add an API to @glimmer/syntax to effectively take either a string template or template AST and return a list of the locals
  • Update this to leverage that API (which can be retrieved from Ember's ember-template-compiler.js).
  • Figure out a sync API (we'll need the same general code for eslint plugins)

@pzuraq pzuraq force-pushed the add-preprocess-function branch 8 times, most recently from 1f33a84 to 3e1c1fe Compare March 23, 2021 16:38
.eslintrc.js Outdated Show resolved Hide resolved
.eslintrc.js Outdated Show resolved Hide resolved
.eslintrc.js Outdated Show resolved Hide resolved
package.json Outdated Show resolved Hide resolved
@pzuraq pzuraq force-pushed the add-preprocess-function branch 3 times, most recently from f55d22a to 31782bd Compare March 23, 2021 22:54
@pzuraq pzuraq merged commit 4568c0c into master Mar 24, 2021
@delete-merged-branch delete-merged-branch bot deleted the add-preprocess-function branch March 24, 2021 00:00
@rwjblue rwjblue changed the title Add preprocessEmbeddedTemplates function Add preprocessEmbeddedTemplates function Mar 24, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants