* wip on storybook as a replacement for using UI components in docusaurus, since it causes too many problems * fix: storybook webpack config * feat: add more stories * feat: add more stories * feat: add more stories * feat: fix logo and babel runtime error * feat: move to mdx docs for ui * feat: enhanced mdx for header and styles * feat: Add button usecases * feat: Add buttonGroup docs * feat: Add docs and use case to cine and contex menu * feat: fix decorators * feat: add header and dropdown docs * feat: add Icon and input docs * feat: add more docs * feat: add more stories * fix: feedback section * feat: Add doc page * feat: Add typography and color stories * yarn lock * add analytics to v3-ui * new banner image * new viewport component * update review comments
63 lines
1.7 KiB
JavaScript
63 lines
1.7 KiB
JavaScript
const path = require('path');
|
|
|
|
module.exports = {
|
|
stories: ['../src/**/*.stories.@(mdx)'],
|
|
addons: ['@storybook/addon-links', '@storybook/addon-essentials', '@storybook/addon-google-analytics'],
|
|
core: {
|
|
builder: 'webpack5',
|
|
},
|
|
staticDirs: ['../static'],
|
|
webpackFinal: async (config, { configType }) => {
|
|
// `configType` has a value of 'DEVELOPMENT' or 'PRODUCTION'
|
|
// You can change the configuration based on that.
|
|
// 'PRODUCTION' is used when building the static version of storybook.
|
|
// config.module.rules[0].use[0].options.plugins[1] = [
|
|
// '@babel/plugin-proposal-class-properties',
|
|
// { loose: true },
|
|
// ];
|
|
|
|
// Make whatever fine-grained changes you need
|
|
config.module.rules.push({
|
|
test: /\.m?js/,
|
|
resolve: {
|
|
fullySpecified: false,
|
|
},
|
|
});
|
|
|
|
// Default rule for images /\.(svg|ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani|pdf)(\?.*)?$/
|
|
const fileLoaderRule = config.module.rules.find(
|
|
rule => rule.test && rule.test.test('.svg')
|
|
);
|
|
fileLoaderRule.exclude = /\.svg$/;
|
|
|
|
// console.log(JSON.stringify(config.module.rules, null, 2));
|
|
|
|
config.module.rules.push({
|
|
test: /\.svg$/,
|
|
use: [
|
|
{ loader: require.resolve('babel-loader') },
|
|
// { loader: 'svg-inline-loader' },
|
|
],
|
|
});
|
|
|
|
config.module.rules.push({
|
|
test: /\.css$/,
|
|
use: [
|
|
{
|
|
loader: 'postcss-loader',
|
|
options: {
|
|
// HERE: OPTIONS
|
|
postcssOptions: {
|
|
plugins: [require('tailwindcss'), require('autoprefixer')],
|
|
},
|
|
},
|
|
},
|
|
],
|
|
include: path.resolve(__dirname, '../'),
|
|
});
|
|
|
|
// Return the altered config
|
|
return config;
|
|
},
|
|
};
|