Discussion: Could this be used for Acorn, and then Webpack.

[TheLarkInn]

So I've been discussing this at length with @danielrosenwasser. Because webpack's AST parser is powered by tern/acorn, it would be incredible to have an extension to plugin to allow all sorts of crazy features via webpack. This makes the overall user story for webpack with typescript, and other frameworks far more promising.

I wanted to start the discussion somewhere, and it looks like eslint and webpack have the same common goals when it comes to parsing.

[texastoland]

Sorry been lurking on this repo a while. In context of TypeScript specifically? What is it doing besides sniffing dependencies?

[TheLarkInn]

@texastoland!!!! Love seeing you lurk it! Do you mean what webpack is doing with acorn as a parser?

[texastoland]

Ha thanks man! Yeah just curious how it could potentially enhance Webpack's capabilities? I'm unfamiliar how it instruments AST stuff.

[TheLarkInn]

Webpacks Parser instance is a Tapable instance that allows you to be able to essentially write plugins that can hook into any AST walk event. Here is a very modest example:

var EvalParserPlugin = function() {

};
EvalParserPlugin.prototype.apply = function(compiler) {
  compiler.parser.plugin('call eval', function(expression) {
    /* You have access to the expression, state of the module its found in, deps, etc. */
    /* Essentially the ability to do anything you want in any part of any code */
  }
};

module.exports = EvalParserPlugin

So this power, which sadly we have not documented very well for the webpack parser is essentially to whatever the acorn parser estree can identify.

A couple benefits I see possible in theory:

• Integration of ts.Program in the webpack Compilation object. Having the ability to extract type metadata through the parser and using it for typechecking etc.
• Ability to have typescript AST transforms directly possible through loaders.
• Tools that were designed on the typescript compiler API, could be implemented as plugins etc. (see angular2 offline compiler).
• You could create a series of plugins (like the SystemImportParserPlugin) that can allow a user to actually never have to transpile TS to use it in webpack.
• Have another means of tree shaking, or more powerful tree shaking thanks to type metadata (see https://github.com/angular/tsickle) + Google Closure Compiler in advanced mode.

Those are just some initial thoughts, however I'm sure there are many more benefits, (I supposed enhanced type errors and checking?)

[nzakas]

Sorry, I'm not sure how this discussion relates to this repository. Can you please explain?

[TheLarkInn]

Sorry if I didn't tie this in. I was wondering if this functionality to be able to use eslint would involve some sort of AST/ESTREE extentions for TS. Is there a way that we can leverage this functionality? Maybe that is my misunderstanding.

[nzakas]

Yes, this parser outputs ESTree format with extensions for TS. See https://github.com/eslint/typescript-eslint-parser/issues/13 for what the plan was.

You can certainly try it out, it's just not ready for production use yet as I haven't gone through and verified the outputted AST is in the correct format in all cases.

[TheLarkInn]

Awesome!! My goal is to experiment adding it to https://github.com/webpack/webpack/blob/master/lib/Parser.js#L1029-L1039 our potential AST types or have a flag that controls the AST type.

Would you mind pointing me in the right direction on including this custom ESTREE extension in acorn? Would be a great way to get some bug reporting on the awesome work you guys have been doing with this.

[JamesHenry]

@TheLarkInn Just to be clear, this project uses the TypeScript compiler to parse the source, and then converts the TypeScript AST into a ESTree-compatible AST. Acorn is not used.

@nzakas added an extensions section to ESTree to begin covering type annotations here: https://github.com/estree/estree/blob/master/extensions/type-annotations.md

We are working to align with Flow's node terminology in the generated AST wherever possible

[TheLarkInn]

Thank you for the clarification, sorry for any confusion!! I think this will be the basis for implementation.

[JamesHenry]

Oh not at all, as a webpack + TS user myself, I really love the idea!

[TheLarkInn]

@JamesHenry alot of the AST parsing, specs ESTREE, acorn are pretty new to me so I'm parsing it all together as I go :sweat_smile:. Would love some brainstorming, and guidance on your part if you see how all of the pieces can fit together.

[JamesHenry]

Sure, I'll definitely give it some thought and help out if I can! Perhaps we could move that discussion to gitter or Twitter DM in the meantime?

[TheLarkInn]

Yup feel free to close the issue thank you all for the help/support. Greatly appreciated!!