fix(storybook): less+sass updates for storybook7
This commit is contained in:
parent
349a23c690
commit
c22d5357ab
@ -14,12 +14,89 @@ module.exports = {
|
||||
'@storybook/addon-links',
|
||||
'@storybook/addon-essentials',
|
||||
'@storybook/preset-scss',
|
||||
'@storybook/addon-postcss',
|
||||
'@storybook/addon-a11y',
|
||||
'storybook-addon-designs',
|
||||
'storybook-addon-fetch-mock',
|
||||
'@storybook/addon-mdx-gfm',
|
||||
'@storybook/addon-styling-webpack'
|
||||
'@storybook/addon-styling-webpack',
|
||||
{
|
||||
name: '@storybook/addon-styling-webpack',
|
||||
|
||||
options: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.css$/,
|
||||
sideEffects: true,
|
||||
use: [
|
||||
require.resolve('style-loader'),
|
||||
{
|
||||
loader: require.resolve('css-loader'),
|
||||
options: {
|
||||
// Want to add more CSS Modules options? Read more here: https://github.com/webpack-contrib/css-loader#modules
|
||||
modules: {
|
||||
auto: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.s[ac]ss$/,
|
||||
sideEffects: true,
|
||||
use: [
|
||||
require.resolve('style-loader'),
|
||||
{
|
||||
loader: require.resolve('css-loader'),
|
||||
options: {
|
||||
// Want to add more CSS Modules options? Read more here: https://github.com/webpack-contrib/css-loader#modules
|
||||
modules: {
|
||||
auto: true,
|
||||
},
|
||||
importLoaders: 2,
|
||||
},
|
||||
},
|
||||
require.resolve('resolve-url-loader'),
|
||||
{
|
||||
loader: require.resolve('sass-loader'),
|
||||
options: {
|
||||
// Want to add more Sass options? Read more here: https://webpack.js.org/loaders/sass-loader/#options
|
||||
implementation: require.resolve('sass'),
|
||||
sourceMap: true,
|
||||
sassOptions: {},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.less$/,
|
||||
sideEffects: true,
|
||||
use: [
|
||||
require.resolve('style-loader'),
|
||||
{
|
||||
loader: require.resolve('css-loader'),
|
||||
options: {
|
||||
// Want to add more CSS Modules options? Read more here: https://github.com/webpack-contrib/css-loader#modules
|
||||
modules: {
|
||||
auto: true,
|
||||
},
|
||||
importLoaders: 1,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: require.resolve('less-loader'),
|
||||
options: {
|
||||
// Want to add more Less options? Read more here: https://webpack.js.org/loaders/less-loader/#options
|
||||
implementation: require.resolve('less'),
|
||||
sourceMap: true,
|
||||
lessOptions: {
|
||||
javascriptEnabled: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
webpackFinal: async (config, { configType }) => {
|
||||
@ -33,31 +110,31 @@ module.exports = {
|
||||
use: ['@svgr/webpack'],
|
||||
});
|
||||
|
||||
config.module.rules.push({
|
||||
test: /\.less$/,
|
||||
use: [
|
||||
require.resolve('style-loader'),
|
||||
require.resolve('css-loader'),
|
||||
{
|
||||
loader: require.resolve('less-loader'),
|
||||
options: {
|
||||
lessOptions: { javascriptEnabled: true },
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
// config.module.rules.push({
|
||||
// test: /\.less$/,
|
||||
// use: [
|
||||
// require.resolve('style-loader'),
|
||||
// require.resolve('css-loader'),
|
||||
// {
|
||||
// loader: require.resolve('less-loader'),
|
||||
// options: {
|
||||
// lessOptions: { javascriptEnabled: true },
|
||||
// },
|
||||
// },
|
||||
// ],
|
||||
// });
|
||||
|
||||
return config;
|
||||
},
|
||||
|
||||
framework: {
|
||||
name: '@storybook/nextjs',
|
||||
options: {}
|
||||
options: {},
|
||||
},
|
||||
|
||||
staticDirs: ['../public', '../../static', './story-assets'],
|
||||
|
||||
docs: {
|
||||
autodocs: true
|
||||
}
|
||||
autodocs: true,
|
||||
},
|
||||
};
|
||||
|
89
web/package-lock.json
generated
89
web/package-lock.json
generated
@ -68,7 +68,7 @@
|
||||
"@storybook/cli": "7.5.1",
|
||||
"@storybook/mdx2-csf": "1.1.0",
|
||||
"@storybook/nextjs": "^7.5.1",
|
||||
"@storybook/preset-scss": "1.0.3",
|
||||
"@storybook/preset-scss": "^1.0.3",
|
||||
"@storybook/react": "7.5.1",
|
||||
"@storybook/testing-library": "0.2.2",
|
||||
"@svgr/webpack": "8.1.0",
|
||||
@ -110,10 +110,10 @@
|
||||
"npm": "^10.0.0",
|
||||
"postcss": "^8.4.31",
|
||||
"prettier": "3.0.3",
|
||||
"resolve-url-loader": "^5.0.0",
|
||||
"sass": "1.69.4",
|
||||
"sass-loader": "13.3.2",
|
||||
"sass-loader": "^13.3.2",
|
||||
"storybook": "^7.5.1",
|
||||
"storybook-addon-designs": "6.3.1",
|
||||
"storybook-addon-fetch-mock": "1.0.1",
|
||||
"storybook-preset-less": "1.1.3",
|
||||
"style-dictionary": "3.8.0",
|
||||
@ -3068,28 +3068,6 @@
|
||||
"integrity": "sha512-cEee/Z+I12mZcFJshKcCqC8tuX5hG3s+d+9nZ3LabqKF1vKdF41B92pJVCBggjAGORAeOzyyDDKrZwIkLffeOQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@figspec/components": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@figspec/components/-/components-1.0.2.tgz",
|
||||
"integrity": "sha512-rTjjH7wvM55ZuX+MRVPND1cs4Z4JspJvKc9lzGxm/8gD4dLfgeFztQuNy+daGglaxcGXLXTuJ2oJtZ0/lmRKmw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"lit": "^2.1.3"
|
||||
}
|
||||
},
|
||||
"node_modules/@figspec/react": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/@figspec/react/-/react-1.0.3.tgz",
|
||||
"integrity": "sha512-r683qOko+5CbT48Ox280fMx2MNAtaFPgCNJvldOqN3YtmAzlcTT+YSxd3OahA+kjXGGrnzDbUgeTOX1cPLII+g==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@figspec/components": "^1.0.1",
|
||||
"@lit-labs/react": "^1.0.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.14.0 || ^17.0.0 || ^18.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@floating-ui/core": {
|
||||
"version": "1.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.5.0.tgz",
|
||||
@ -4284,27 +4262,6 @@
|
||||
"@lezer/lr": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lit-labs/react": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@lit-labs/react/-/react-1.2.1.tgz",
|
||||
"integrity": "sha512-DiZdJYFU0tBbdQkfwwRSwYyI/mcWkg3sWesKRsHUd4G+NekTmmeq9fzsurvcKTNVa0comNljwtg4Hvi1ds3V+A==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@lit-labs/ssr-dom-shim": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@lit-labs/ssr-dom-shim/-/ssr-dom-shim-1.1.2.tgz",
|
||||
"integrity": "sha512-jnOD+/+dSrfTWYfSXBXlo5l5f0q1UuJo3tkbMDCYA2lKUYq79jaxqtGEvnRoh049nt1vdo1+45RinipU6FGY2g==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@lit/reactive-element": {
|
||||
"version": "1.6.3",
|
||||
"resolved": "https://registry.npmjs.org/@lit/reactive-element/-/reactive-element-1.6.3.tgz",
|
||||
"integrity": "sha512-QuTgnG52Poic7uM1AN5yJ09QMe0O28e10XzSvWDz02TJiiKee4stsiownEIadWm8nYzyDAyT+gKzUoZmiWQtsQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@lit-labs/ssr-dom-shim": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@mdx-js/react": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/@mdx-js/react/-/react-2.3.0.tgz",
|
||||
@ -27403,37 +27360,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/lit": {
|
||||
"version": "2.8.0",
|
||||
"resolved": "https://registry.npmjs.org/lit/-/lit-2.8.0.tgz",
|
||||
"integrity": "sha512-4Sc3OFX9QHOJaHbmTMk28SYgVxLN3ePDjg7hofEft2zWlehFL3LiAuapWc4U/kYwMYJSh2hTCPZ6/LIC7ii0MA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@lit/reactive-element": "^1.6.0",
|
||||
"lit-element": "^3.3.0",
|
||||
"lit-html": "^2.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/lit-element": {
|
||||
"version": "3.3.3",
|
||||
"resolved": "https://registry.npmjs.org/lit-element/-/lit-element-3.3.3.tgz",
|
||||
"integrity": "sha512-XbeRxmTHubXENkV4h8RIPyr8lXc+Ff28rkcQzw3G6up2xg5E8Zu1IgOWIwBLEQsu3cOVFqdYwiVi0hv0SlpqUA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@lit-labs/ssr-dom-shim": "^1.1.0",
|
||||
"@lit/reactive-element": "^1.3.0",
|
||||
"lit-html": "^2.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/lit-html": {
|
||||
"version": "2.8.0",
|
||||
"resolved": "https://registry.npmjs.org/lit-html/-/lit-html-2.8.0.tgz",
|
||||
"integrity": "sha512-o9t+MQM3P4y7M7yNzqAyjp7z+mQGa4NS4CxiyLqFPyFWyc4O+nodLrkrxSaCTrla6M5YOLaT3RpbbqjszB5g3Q==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/trusted-types": "^2.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/load-json-file": {
|
||||
"version": "6.2.0",
|
||||
"resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-6.2.0.tgz",
|
||||
@ -39045,15 +38971,6 @@
|
||||
"url": "https://opencollective.com/storybook"
|
||||
}
|
||||
},
|
||||
"node_modules/storybook-addon-designs": {
|
||||
"version": "6.3.1",
|
||||
"resolved": "https://registry.npmjs.org/storybook-addon-designs/-/storybook-addon-designs-6.3.1.tgz",
|
||||
"integrity": "sha512-QCHZp4KuUikOq52MPiMfU8QifYTfhHar5vWlbcfkFDz1YrgGMy+QAEt5Y3Vdnffl4GKSK1lAsLuvTuzqTBRvnw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@figspec/react": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/storybook-addon-fetch-mock": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/storybook-addon-fetch-mock/-/storybook-addon-fetch-mock-1.0.1.tgz",
|
||||
|
@ -74,7 +74,7 @@
|
||||
"@storybook/cli": "7.5.1",
|
||||
"@storybook/mdx2-csf": "1.1.0",
|
||||
"@storybook/nextjs": "^7.5.1",
|
||||
"@storybook/preset-scss": "1.0.3",
|
||||
"@storybook/preset-scss": "^1.0.3",
|
||||
"@storybook/react": "7.5.1",
|
||||
"@storybook/testing-library": "0.2.2",
|
||||
"@svgr/webpack": "8.1.0",
|
||||
@ -116,10 +116,10 @@
|
||||
"npm": "^10.0.0",
|
||||
"postcss": "^8.4.31",
|
||||
"prettier": "3.0.3",
|
||||
"resolve-url-loader": "^5.0.0",
|
||||
"sass": "1.69.4",
|
||||
"sass-loader": "13.3.2",
|
||||
"sass-loader": "^13.3.2",
|
||||
"storybook": "^7.5.1",
|
||||
"storybook-addon-designs": "6.3.1",
|
||||
"storybook-addon-fetch-mock": "1.0.1",
|
||||
"storybook-preset-less": "1.1.3",
|
||||
"style-dictionary": "3.8.0",
|
||||
|
Loading…
x
Reference in New Issue
Block a user