diff --git a/src/docs/additional/additional.mdx b/src/docs/additional/additional.mdx index 54265fb..098a541 100644 --- a/src/docs/additional/additional.mdx +++ b/src/docs/additional/additional.mdx @@ -45,6 +45,30 @@ DireflowComponent.create({ }); ``` +## Anonymous Slot +The Web Component Standard supports slot. +In order to enable the anonymous slot, set the useAnonymousSlot property to `true` in the configuration. +So you can distribute your content(text or embed component) to a tag. + + +```javascript +// src/cool-component/index.js +DireflowComponent.create({ + component: App, + configuration: { + tagname: 'cool-component', + useShadow: true, + useAnonymousSlot: true, + }, +}); +``` +```html + +
I will be distributed to cool-component's inner slot tag.
+
+``` + + ## IE 11 Support In order to support IE 11, you will need to import the necessary polyfills. diff --git a/src/docs/get-started/get-started.mdx b/src/docs/get-started/get-started.mdx index 861faf9..9da7d98 100644 --- a/src/docs/get-started/get-started.mdx +++ b/src/docs/get-started/get-started.mdx @@ -138,10 +138,20 @@ A Direflow Setup is using the same configuration as in [create-react-app](https: However, this file offers the ability to further override any of the Webpack config that ships with Direflow. Simply add an override after the first line: ```javascript -module.exports = (config, env) => ({ - ...webpackConfig(config, env), - // Add your own webpack config here (optional) -}); +module.exports = { + webpack: (config, env) => ({ + ...webpackConfig(config, env), + // Add your own webpack config here (optional) + }), + devServer: (configFunction) => { + return function (proxy, allowedHost) { + // Add your own devServer proxy config here + // Such as proxy = {target: "/direflow", secure: false, changeOrigin: true } + const config = configFunction(proxy, allowedHost); + return config; + }; + }, +}; ``` ## Access the DOM element