-
Notifications
You must be signed in to change notification settings - Fork 83
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
docs(storybook): update Vue and Angular docs #475
Conversation
acstll
commented
Jul 26, 2021
•
edited
Loading
edited
- update Vue and Angular docs
- add proxy-package deprecation warning in README
- make sure translations are good
- update example apps in examples/ folder
```js | ||
// main.js | ||
Vue.config.ignoredElements = [/scale-\w*/]; | ||
``` | ||
|
||
For **Vue v3**, set `compilerOptions.isCustomElement`: | ||
|
||
```js | ||
// in webpack config | ||
rules: [ | ||
{ | ||
test: /\.vue$/, | ||
use: 'vue-loader', | ||
options: { | ||
compilerOptions: { | ||
isCustomElement: (tag) => tag.startsWith('scale-'), | ||
}, | ||
}, | ||
}, | ||
// ... | ||
]; | ||
|
||
// or in main.js (on-the-fly template compilation) | ||
const app = Vue.createApp({}); | ||
app.config.compilerOptions.isCustomElement = (tag) => tag.startsWith('scale-'); | ||
``` |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hey,
It's a nice improvement for vue3.
But it only handles basic setups with Webpack and doesn't have a solution for vue-cli which uses vue.config.js files.
For our Project using single-spa-vue a vue.config.js file would be preferred since we would dislike using an additional webpack file.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hey, we can surely add the vue.config.js
version of this, which is actually what we're using in the updated Vue3 example.
// vue.config.js
chainWebpack: config => {
config.module
.rule('vue')
.use('vue-loader')
.tap(options => {
// https://v3.vuejs.org/guide/migration/custom-elements-interop.html#autonomous-custom-elements
options.compilerOptions = {
isCustomElement: (tag) => tag.startsWith('scale-')
}
return options
})
}
This is what you're referring to, right?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Jup exactly 👍
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
amazing, will update
#500 👀 |