We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
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
Hi, I'm bumping react-styleguidist to the latest version (12) and I start to have this warning popping up when I try to lunch the server:
This is how it looks like my configuration:
module.exports = { webpackConfig: { ...require('./build/webpack.styleguide.js') }, assetsDir: './docs/images', propsParser: require('react-docgen-typescript').withCustomConfig('./tsconfig.json', { savePropValueAsString: true, }).parse, title: 'Component Library Style Guide', pagePerSection: true, sections: [ // list of sections ], ignore: [ '**/__tests__/**', '**/__snapshots__/**', '**/*.test.{js,jsx,ts,tsx}', '**/*.spec.{js,jsx,ts,tsx}', '**/*.d.ts', '**/*.styled.{js,jsx,ts,tsx}', '**/Icons.tsx', '**/atoms/Gifs/**', '**/atoms/Icons/**', '**/molecules/Page/PageManager.tsx', ], skipComponentsWithoutExample: true, verbose: false, template: { head: { raw: ` <style type="text/css"> @font-face { font-family: 'Gotham'; src: url(./src/fonts/gotham/Gotham-Book.woff2) format('woff2'), url(./src/fonts/gotham/Gotham-Book.woff) format('woff'); /* IE9 Compat Modes */ } @font-face { font-family: 'Gotham'; src: url(./src/fonts/gotham/Gotham-Bold.woff2) format('woff2'), url(./src/fonts/gotham/Gotham-Bold.woff) format('woff'); /* IE9 Compat Modes */ font-weight: bold; } @font-face { font-family: 'GothamTabular'; src: url('./src/fonts/gotham/Gotham-Book-tabular.woff') format('woff'); /* font with tabularised numbers */ } @font-face { font-family: 'GothamTabular'; src: url('./src/fonts/gotham/Gotham-Bold.woff2') format('woff2'), url('./src/fonts/gotham/Gotham-Bold.woff') format('woff'); /* IE9 Compat Modes */ font-weight: bold; } @font-face { font-family: 'GothamTabularBold'; src: url('./gotham/Gotham-Book-tabular.woff') format('woff'); /* font with tabularised numbers */ } </style> `, }, }, };
The weird thing is that I disabled the overlay for warning in my webpack configuration, but it keep appearing.
const TypescriptPlugingForStyledComponent = require('typescript-plugin-styled-components').default; const path = require('path'); const webpack = require('webpack'); const TsConfigPathsPlugin = require('tsconfig-paths-webpack-plugin'); const MiniCssExtractPlugin = require('mini-css-extract-plugin'); module.exports = { module: { rules: [ { test: /\.(t|j)sx?$/, exclude: /node_modules/, loader: 'ts-loader', options: { transpileOnly: true, getCustomTransformers: () => { return { before: [TypescriptPlugingForStyledComponent()], }; }, }, }, { test: /\.css$/, use: [MiniCssExtractPlugin.loader, 'css-loader'], }, { test: /\.(jpe?g|png|gif|svg)$/i, exclude: [ /node_modules/, path.resolve(__dirname, '../src/components/atoms/Icons/Results'), path.resolve(__dirname, '../src/components/atoms/TrevorLoading'), ], use: [ { loader: 'url-loader', }, ], }, { test: /\.jpe?g$|\.png$|\.svg$/, include: [path.resolve(__dirname, '../src/components/atoms/Icons/Results')], use: { loader: 'file-loader', options: { name: 'img/sd/[name].[ext]?[hash]', }, }, }, { test: /\.(gif)$/i, include: [path.resolve(__dirname, '../src/components/atoms/TrevorLoading')], use: { loader: 'file-loader', options: { name: 'img/[name].[ext]', }, }, }, { test: /\.(woff|woff2|ttf|otf)$/i, use: { loader: 'file-loader', options: { name: 'fonts/[name].[ext]', }, }, }, ], }, resolve: { extensions: ['.ts', '.tsx', '.js', '.jsx', '.css', '.png', '.gif', '.svg', '.d.ts', '.woff', '.woff2'], modules: [path.join(__dirname, '../src'), 'node_modules'], plugins: [ new TsConfigPathsPlugin({ configFile: path.resolve(__dirname, '../tsconfig.json'), }), ], alias: { '@internal/component-library': path.resolve(__dirname, '../src/index.ts') }, fallback: { url: require.resolve('url'), }, }, plugins: [ new MiniCssExtractPlugin(), new webpack.ProvidePlugin({ process: 'process/browser', }), ], devServer: { allowedHosts: ['host.docker.internal'], client: { overlay: { errors: true, warnings: false, }, }, }, };
What am I doing wrong?
The text was updated successfully, but these errors were encountered:
I haven't solved the issue described here but I've noticed how the devServer object is not picked up by the new version of the library.
The PR above addresses this bug.
Sorry, something went wrong.
No branches or pull requests
Hi, I'm bumping react-styleguidist to the latest version (12) and I start to have this warning popping up when I try to lunch the server:
This is how it looks like my configuration:
The weird thing is that I disabled the overlay for warning in my webpack configuration, but it keep appearing.
What am I doing wrong?
The text was updated successfully, but these errors were encountered: