-
Notifications
You must be signed in to change notification settings - Fork 920
Description
What problem does this feature solve?
My issue doesn't fit neatly within either Bug Report or Feature Request -- it's likely closest to Feature Request as I am requesting more information in the documentation. Please see the Proposed API section for my proposed resolution to this matter.
It doesn't seem to be clear from the migration documentation how we are supposed to migrate usage of postLoaders
to a Webpack Module Rule, specifically for the default template SFC block. In Vue Loader 14, we were able to assign a Webpack loader to the html
property of postLoaders
to obtain access to the emitted render function. The documentation does indicate how to process a new type of template language (pug), but not how to work with the render function that is emitted from a default template block.
In my case, I parse the emitted render function with an AST to extract parameters of specific function calls instead of statically parsing file contents using gettext. I have attempted to load the output from a template block in a number of different ways, referring to the Webpack documentation as well as the Vue Loader documentation. My loader is able to parse the script
block but not the render function emitted from the template
. Should we be targeting test
with /\.html$/
, or /\.vue$/
? Do we need to use a resourceQuery? Do we need to use enforce: 'post'
? Do we need to add a new language extension to every template block? There are a lot of variables in this that the standard Webpack documentation cannot address easily. I suppose this is one of the challenges of being coupled to Webpack -- their documentation needs to be complemented.
I seem to have the most success with this rule:
{
resourceQuery: /^\?vue/,
enforce: 'post',
loader: resolve(__dirname, '../translations/webpackLoader'),
},
Though it seems bare:
Starting new source: /[redacted]/modules/common/components/SampleComponent/index.vue
var render = function () {}
var staticRenderFns = []
export { render, staticRenderFns }
Component template for reference:
<template>
<div>
<h2>{{ label }}</h2>
<p>This is dummy text</p>
<p>{{ $t('Sample Component for !{name}', 'This is the context', { name }) }}</p>
</div>
</template>
What does the proposed API look like?
If there is an obvious reason for not being able to parse the template block's render function, I can create a PR to call it out in the docs right away. If there is not an obvious reason, I will spend some time creating a reproduction repository and file a bug report so we can investigate further and then add our findings (examples and explanations) to the docs.