Skip to content

Commit be1a05d

Browse files
committedJun 15, 2018
docs: add functional option
1 parent c3cb922 commit be1a05d

File tree

1 file changed

+34
-2
lines changed

1 file changed

+34
-2
lines changed
 

‎README.md

+34-2
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,38 @@ module.exports = {
6262
}
6363
```
6464

65+
### Functional Component
66+
67+
If you want to use functional component template, you need to set `functional: true` option to loader options. You may want to use `oneOf` to handle both normal and functional template configs.
68+
69+
```js
70+
module.exports = {
71+
module: {
72+
rules: [
73+
{
74+
test: /\.html$/,
75+
oneOf: [
76+
// If the file name has `.functional` suffix, treat it as functional component template
77+
// You can change this rule whatever you want.
78+
{
79+
test: /\.functional\.html$/,
80+
loader: 'vue-template-loader',
81+
options: {
82+
functional: true
83+
}
84+
},
85+
86+
// Normal component template
87+
{
88+
loader : 'vue-template-loader'
89+
}
90+
]
91+
}
92+
]
93+
}
94+
}
95+
```
96+
6597
### Loading Scoped Styles
6698

6799
For an explanation of scoped styles, see the [vue-loader docs](https://vue-loader.vuejs.org/en/features/scoped-css.html).
@@ -240,9 +272,9 @@ If you use this loader with TypeScript, make sure to add a declaration file for
240272

241273
```ts
242274
declare module '*.html' {
243-
import Vue, { ComponentOptions } from 'vue'
275+
import Vue, { ComponentOptions, FunctionalComponentOptions } from 'vue'
244276
interface WithRender {
245-
<V extends Vue>(options: ComponentOptions<V>): ComponentOptions<V>
277+
<V extends Vue, U extends ComponentOptions<V> | FunctionalComponentOptions>(options: U): U
246278
<V extends typeof Vue>(component: V): V
247279
}
248280
const withRender: WithRender

0 commit comments

Comments
 (0)
Please sign in to comment.