aleleba/create-react-component-library
1
0
Fork 0
mirror of https://github.com/aleleba/create-react-component-library.git synced 2025-01-09 05:06:53 -06:00
Code Issues Actions Packages Projects 1 Releases Wiki Activity

PR-665639: Update webpack.config.ts, webpack.cy.config.ts,

Browse Source 
.storybook/main.js, and package.json to add support to sass modules.
This commit is contained in:
Alejandro Lembke Barrientos 2023-11-22 15:23:48 +00:00
parent 7e1457cbf8
commit b1c9a66f23
5 changed files with 74 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
.storybook/main.js
View File

@ -6,7 +6,21 @@ const deFaultValues = {
const prefixUrl = process.env.PREFIX_URL ? process.env.PREFIX_URL : deFaultValues.PREFIX_URL const prefixUrl = process.env.PREFIX_URL ? process.env.PREFIX_URL : deFaultValues.PREFIX_URL
module.exports = { module.exports = {
"stories": ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], "stories": ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
"addons": ["@storybook/addon-links", "@storybook/addon-essentials", "@storybook/addon-interactions", "@storybook/preset-scss"], "addons": [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-interactions",
{
name: '@storybook/preset-scss',
options: {
cssLoaderOptions: {
modules: {
auto: /\.module\.\w+$/i,
}
}
}
}
],
"webpackFinal": async config => { "webpackFinal": async config => {
config.entry = config.entry.map(function(entry) { config.entry = config.entry.map(function(entry) {
if (entry.includes("webpack-hot-middleware")) { if (entry.includes("webpack-hot-middleware")) {

74
package-lock.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "@aleleba/create-react-component-library", "name": "@aleleba/create-react-component-library",
"version": "1.2.17", "version": "1.2.18",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "@aleleba/create-react-component-library", "name": "@aleleba/create-react-component-library",
"version": "1.2.17", "version": "1.2.18",
"license": "MIT", "license": "MIT",
"bin": { "bin": {
"create-react-component-library": "bin/cli.js" "create-react-component-library": "bin/cli.js"
@ -32,16 +32,16 @@
"@testing-library/jest-dom": "^6.1.4", "@testing-library/jest-dom": "^6.1.4",
"@testing-library/react": "^14.1.2", "@testing-library/react": "^14.1.2",
"@testing-library/user-event": "^14.5.1", "@testing-library/user-event": "^14.5.1",
"@types/jest": "^29.5.8", "@types/jest": "^29.5.10",
"@types/node": "^20.9.2", "@types/node": "^20.9.4",
"@types/react": "^18.2.37", "@types/react": "^18.2.38",
"@types/react-dom": "^18.2.15", "@types/react-dom": "^18.2.17",
"@types/webpack": "^5.28.5", "@types/webpack": "^5.28.5",
"babel-loader": "^9.1.3", "babel-loader": "^9.1.3",
"clean-webpack-plugin": "^4.0.0", "clean-webpack-plugin": "^4.0.0",
"css-loader": "^6.8.1", "css-loader": "^6.8.1",
"css-minimizer-webpack-plugin": "^5.0.1", "css-minimizer-webpack-plugin": "^5.0.1",
"cypress": "^13.5.1", "cypress": "^13.6.0",
"dotenv": "^16.3.1", "dotenv": "^16.3.1",
"eslint": "^8.54.0", "eslint": "^8.54.0",
"eslint-plugin-react": "^7.33.2", "eslint-plugin-react": "^7.33.2",
@ -6920,9 +6920,9 @@
} }
}, },
"node_modules/@types/jest": { "node_modules/@types/jest": {
"version": "29.5.8", "version": "29.5.10",
"resolved": "https://registry.npmjs.org/@types/jest/-/jest-29.5.8.tgz", "resolved": "https://registry.npmjs.org/@types/jest/-/jest-29.5.10.tgz",
"integrity": "sha512-fXEFTxMV2Co8ZF5aYFJv+YeA08RTYJfhtN5c9JSv/mFEMe+xxjufCb+PHL+bJcMs/ebPUsBu+UNTEz+ydXrR6g==", "integrity": "sha512-tE4yxKEphEyxj9s4inideLHktW/x6DwesIwWZ9NN1FKf9zbJYsnhBoA9vrHA/IuIOKwPa5PcFBNV4lpMIOEzyQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"expect": "^29.0.0", "expect": "^29.0.0",
@ -7033,9 +7033,9 @@
"dev": true "dev": true
}, },
"node_modules/@types/node": { "node_modules/@types/node": {
"version": "20.9.2", "version": "20.9.4",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.9.2.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.9.4.tgz",
"integrity": "sha512-WHZXKFCEyIUJzAwh3NyyTHYSR35SevJ6mZ1nWwJafKtiQbqRTIKSRcw3Ma3acqgsent3RRDqeVwpHntMk+9irg==", "integrity": "sha512-wmyg8HUhcn6ACjsn8oKYjkN/zUzQeNtMy44weTJSM6p4MMzEOuKbA3OjJ267uPCOW7Xex9dyrNTful8XTQYoDA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"undici-types": "~5.26.4" "undici-types": "~5.26.4"
@ -7088,9 +7088,9 @@
"dev": true "dev": true
}, },
"node_modules/@types/react": { "node_modules/@types/react": {
"version": "18.2.37", "version": "18.2.38",
"resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.37.tgz", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.38.tgz",
"integrity": "sha512-RGAYMi2bhRgEXT3f4B92WTohopH6bIXw05FuGlmJEnv/omEn190+QYEIYxIAuIBdKgboYYdVved2p1AxZVQnaw==", "integrity": "sha512-cBBXHzuPtQK6wNthuVMV6IjHAFkdl/FOPFIlkd81/Cd1+IqkHu/A+w4g43kaQQoYHik/ruaQBDL72HyCy1vuMw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@types/prop-types": "*", "@types/prop-types": "*",
@ -7099,9 +7099,9 @@
} }
}, },
"node_modules/@types/react-dom": { "node_modules/@types/react-dom": {
"version": "18.2.15", "version": "18.2.17",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.15.tgz", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.17.tgz",
"integrity": "sha512-HWMdW+7r7MR5+PZqJF6YFNSCtjz1T0dsvo/f1BV6HkV+6erD/nA7wd9NM00KVG83zf2nJ7uATPO9ttdIPvi3gg==", "integrity": "sha512-rvrT/M7Df5eykWFxn6MYt5Pem/Dbyc1N8Y0S9Mrkw2WFCRiqUgw9P7ul2NpwsXCSM1DVdENzdG9J5SreqfAIWg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@types/react": "*" "@types/react": "*"
@ -9997,9 +9997,9 @@
"dev": true "dev": true
}, },
"node_modules/cypress": { "node_modules/cypress": {
"version": "13.5.1", "version": "13.6.0",
"resolved": "https://registry.npmjs.org/cypress/-/cypress-13.5.1.tgz", "resolved": "https://registry.npmjs.org/cypress/-/cypress-13.6.0.tgz",
"integrity": "sha512-yqLViT0D/lPI8Kkm7ciF/x/DCK/H/DnogdGyiTnQgX4OVR2aM30PtK+kvklTOD1u3TuItiD9wUQAF8EYWtyZug==", "integrity": "sha512-quIsnFmtj4dBUEJYU4OH0H12bABJpSujvWexC24Ju1gTlKMJbeT6tTO0vh7WNfiBPPjoIXLN+OUqVtiKFs6SGw==",
"dev": true, "dev": true,
"hasInstallScript": true, "hasInstallScript": true,
"dependencies": { "dependencies": {
@ -25463,9 +25463,9 @@
} }
}, },
"@types/jest": { "@types/jest": {
"version": "29.5.8", "version": "29.5.10",
"resolved": "https://registry.npmjs.org/@types/jest/-/jest-29.5.8.tgz", "resolved": "https://registry.npmjs.org/@types/jest/-/jest-29.5.10.tgz",
"integrity": "sha512-fXEFTxMV2Co8ZF5aYFJv+YeA08RTYJfhtN5c9JSv/mFEMe+xxjufCb+PHL+bJcMs/ebPUsBu+UNTEz+ydXrR6g==", "integrity": "sha512-tE4yxKEphEyxj9s4inideLHktW/x6DwesIwWZ9NN1FKf9zbJYsnhBoA9vrHA/IuIOKwPa5PcFBNV4lpMIOEzyQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"expect": "^29.0.0", "expect": "^29.0.0",
@ -25562,9 +25562,9 @@
"dev": true "dev": true
}, },
"@types/node": { "@types/node": {
"version": "20.9.2", "version": "20.9.4",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.9.2.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.9.4.tgz",
"integrity": "sha512-WHZXKFCEyIUJzAwh3NyyTHYSR35SevJ6mZ1nWwJafKtiQbqRTIKSRcw3Ma3acqgsent3RRDqeVwpHntMk+9irg==", "integrity": "sha512-wmyg8HUhcn6ACjsn8oKYjkN/zUzQeNtMy44weTJSM6p4MMzEOuKbA3OjJ267uPCOW7Xex9dyrNTful8XTQYoDA==",
"dev": true, "dev": true,
"requires": { "requires": {
"undici-types": "~5.26.4" "undici-types": "~5.26.4"
@ -25617,9 +25617,9 @@
"dev": true "dev": true
}, },
"@types/react": { "@types/react": {
"version": "18.2.37", "version": "18.2.38",
"resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.37.tgz", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.38.tgz",
"integrity": "sha512-RGAYMi2bhRgEXT3f4B92WTohopH6bIXw05FuGlmJEnv/omEn190+QYEIYxIAuIBdKgboYYdVved2p1AxZVQnaw==", "integrity": "sha512-cBBXHzuPtQK6wNthuVMV6IjHAFkdl/FOPFIlkd81/Cd1+IqkHu/A+w4g43kaQQoYHik/ruaQBDL72HyCy1vuMw==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/prop-types": "*", "@types/prop-types": "*",
@ -25628,9 +25628,9 @@
} }
}, },
"@types/react-dom": { "@types/react-dom": {
"version": "18.2.15", "version": "18.2.17",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.15.tgz", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.17.tgz",
"integrity": "sha512-HWMdW+7r7MR5+PZqJF6YFNSCtjz1T0dsvo/f1BV6HkV+6erD/nA7wd9NM00KVG83zf2nJ7uATPO9ttdIPvi3gg==", "integrity": "sha512-rvrT/M7Df5eykWFxn6MYt5Pem/Dbyc1N8Y0S9Mrkw2WFCRiqUgw9P7ul2NpwsXCSM1DVdENzdG9J5SreqfAIWg==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/react": "*" "@types/react": "*"
@ -27818,9 +27818,9 @@
"dev": true "dev": true
}, },
"cypress": { "cypress": {
"version": "13.5.1", "version": "13.6.0",
"resolved": "https://registry.npmjs.org/cypress/-/cypress-13.5.1.tgz", "resolved": "https://registry.npmjs.org/cypress/-/cypress-13.6.0.tgz",
"integrity": "sha512-yqLViT0D/lPI8Kkm7ciF/x/DCK/H/DnogdGyiTnQgX4OVR2aM30PtK+kvklTOD1u3TuItiD9wUQAF8EYWtyZug==", "integrity": "sha512-quIsnFmtj4dBUEJYU4OH0H12bABJpSujvWexC24Ju1gTlKMJbeT6tTO0vh7WNfiBPPjoIXLN+OUqVtiKFs6SGw==",
"dev": true, "dev": true,
"requires": { "requires": {
"@cypress/request": "^3.0.0", "@cypress/request": "^3.0.0",

12
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "@aleleba/create-react-component-library", "name": "@aleleba/create-react-component-library",
"version": "1.2.17", "version": "1.2.18",
"description": "A starter kit for create a React component Library with storybook", "description": "A starter kit for create a React component Library with storybook",
"bin": "./bin/cli.js", "bin": "./bin/cli.js",
"main": "dist/index.js", "main": "dist/index.js",
@ -55,16 +55,16 @@
"@testing-library/jest-dom": "^6.1.4", "@testing-library/jest-dom": "^6.1.4",
"@testing-library/react": "^14.1.2", "@testing-library/react": "^14.1.2",
"@testing-library/user-event": "^14.5.1", "@testing-library/user-event": "^14.5.1",
"@types/jest": "^29.5.8", "@types/jest": "^29.5.10",
"@types/node": "^20.9.2", "@types/node": "^20.9.4",
"@types/react": "^18.2.37", "@types/react": "^18.2.38",
"@types/react-dom": "^18.2.15", "@types/react-dom": "^18.2.17",
"@types/webpack": "^5.28.5", "@types/webpack": "^5.28.5",
"babel-loader": "^9.1.3", "babel-loader": "^9.1.3",
"clean-webpack-plugin": "^4.0.0", "clean-webpack-plugin": "^4.0.0",
"css-loader": "^6.8.1", "css-loader": "^6.8.1",
"css-minimizer-webpack-plugin": "^5.0.1", "css-minimizer-webpack-plugin": "^5.0.1",
"cypress": "^13.5.1", "cypress": "^13.6.0",
"dotenv": "^16.3.1", "dotenv": "^16.3.1",
"eslint": "^8.54.0", "eslint": "^8.54.0",
"eslint-plugin-react": "^7.33.2", "eslint-plugin-react": "^7.33.2",

9
webpack.config.ts
View File

@ -55,7 +55,14 @@ export default {
test: /\.(css|sass|scss)$/, test: /\.(css|sass|scss)$/,
use: [ use: [
externalCss === true ? MiniCssExtractPlugin.loader : 'style-loader', externalCss === true ? MiniCssExtractPlugin.loader : 'style-loader',
'css-loader', {
'loader': 'css-loader',
'options': {
modules: {
auto: /\.module\.\w+$/i,
}
},
},
'sass-loader', 'sass-loader',
], ],
}, },

9
webpack.cy.config.ts
View File

@ -56,7 +56,14 @@ export default {
test: /\.(css|sass|scss)$/, test: /\.(css|sass|scss)$/,
use: [ use: [
externalCss === true ? MiniCssExtractPlugin.loader : 'style-loader', externalCss === true ? MiniCssExtractPlugin.loader : 'style-loader',
'css-loader', {
'loader': 'css-loader',
'options': {
modules: {
auto: /\.module\.\w+$/i,
}
},
},
'sass-loader', 'sass-loader',
], ],
}, },