diff --git a/samples/react-associated-hub-links/assets/tailwind.css b/samples/react-associated-hub-links/assets/tailwind.css new file mode 100644 index 000000000..21e6249ed --- /dev/null +++ b/samples/react-associated-hub-links/assets/tailwind.css @@ -0,0 +1,2 @@ +@import "tailwindcss/components"; +@import "tailwindcss/utilities"; \ No newline at end of file diff --git a/samples/react-associated-hub-links/gulpfile.js b/samples/react-associated-hub-links/gulpfile.js index 8e3857742..b39cbc20d 100644 --- a/samples/react-associated-hub-links/gulpfile.js +++ b/samples/react-associated-hub-links/gulpfile.js @@ -18,5 +18,29 @@ const { addFastServe } = require("spfx-fast-serve-helpers"); addFastServe(build); /* end of fast-serve */ +// TailwindCSS +const postcss = require("gulp-postcss"); +const atimport = require("postcss-import"); +const tailwind = require("tailwindcss"); + +const tailwindcss = build.subTask( + "tailwindcss", + function (gulp, buildOptions, done) { + gulp + .src("assets/tailwind.css") + .pipe( + postcss([ + atimport(), + tailwind("./tailwind.config.js"), + ]) + ) + .pipe(gulp.dest("assets/dist")); + done(); + } +); +build.rig.addPreBuildTask(tailwindcss); + +// end TailwindCSS + build.initialize(require('gulp')); diff --git a/samples/react-associated-hub-links/package.json b/samples/react-associated-hub-links/package.json index c51a9a0bb..17ad7ec59 100644 --- a/samples/react-associated-hub-links/package.json +++ b/samples/react-associated-hub-links/package.json @@ -10,30 +10,35 @@ "serve": "gulp bundle --custom-serve --max_old_space_size=4096 && fast-serve" }, "dependencies": { - "tslib": "2.3.1", - "react": "16.13.1", - "react-dom": "16.13.1", - "office-ui-fabric-react": "7.185.7", "@microsoft/sp-core-library": "1.15.2", + "@microsoft/sp-lodash-subset": "1.15.2", + "@microsoft/sp-office-ui-fabric-core": "1.15.2", "@microsoft/sp-property-pane": "1.15.2", "@microsoft/sp-webpart-base": "1.15.2", - "@microsoft/sp-lodash-subset": "1.15.2", - "@microsoft/sp-office-ui-fabric-core": "1.15.2" + "office-ui-fabric-react": "7.185.7", + "react": "16.13.1", + "react-dom": "16.13.1", + "tslib": "2.3.1" }, "devDependencies": { - "@microsoft/rush-stack-compiler-4.5": "0.2.2", - "@rushstack/eslint-config": "2.5.1", - "@microsoft/eslint-plugin-spfx": "1.15.2", "@microsoft/eslint-config-spfx": "1.15.2", + "@microsoft/eslint-plugin-spfx": "1.15.2", + "@microsoft/rush-stack-compiler-4.5": "0.2.2", "@microsoft/sp-build-web": "1.15.2", - "@types/webpack-env": "~1.15.2", - "ajv": "^6.12.5", - "gulp": "4.0.2", - "typescript": "4.5.5", + "@microsoft/sp-module-interfaces": "1.15.2", + "@rushstack/eslint-config": "2.5.1", "@types/react": "16.9.51", "@types/react-dom": "16.9.8", + "@types/webpack-env": "~1.15.2", + "ajv": "^6.12.5", + "autoprefixer": "^10.4.12", "eslint-plugin-react-hooks": "4.3.0", - "@microsoft/sp-module-interfaces": "1.15.2", - "spfx-fast-serve-helpers": "~1.15.0" + "gulp": "4.0.2", + "gulp-postcss": "^9.0.1", + "postcss": "^8.4.18", + "postcss-import": "^15.0.0", + "spfx-fast-serve-helpers": "~1.15.0", + "tailwindcss": "^3.1.8", + "typescript": "4.5.5" } } \ No newline at end of file diff --git a/samples/react-associated-hub-links/pnpm-lock.yaml b/samples/react-associated-hub-links/pnpm-lock.yaml index 998f0fec3..d9fdccf84 100644 --- a/samples/react-associated-hub-links/pnpm-lock.yaml +++ b/samples/react-associated-hub-links/pnpm-lock.yaml @@ -16,12 +16,17 @@ specifiers: '@types/react-dom': 16.9.8 '@types/webpack-env': ~1.15.2 ajv: ^6.12.5 + autoprefixer: ^10.4.12 eslint-plugin-react-hooks: 4.3.0 gulp: 4.0.2 + gulp-postcss: ^9.0.1 office-ui-fabric-react: 7.185.7 + postcss: ^8.4.18 + postcss-import: ^15.0.0 react: 16.13.1 react-dom: 16.13.1 spfx-fast-serve-helpers: ~1.15.0 + tailwindcss: ^3.1.8 tslib: 2.3.1 typescript: 4.5.5 @@ -47,9 +52,14 @@ devDependencies: '@types/react-dom': 16.9.8 '@types/webpack-env': 1.15.3 ajv: 6.12.6 + autoprefixer: 10.4.12_postcss@8.4.18 eslint-plugin-react-hooks: 4.3.0 gulp: 4.0.2 + gulp-postcss: 9.0.1_postcss@8.4.18 + postcss: 8.4.18 + postcss-import: 15.0.0_postcss@8.4.18 spfx-fast-serve-helpers: 1.15.3_typescript@4.5.5 + tailwindcss: 3.1.8 typescript: 4.5.5 packages: @@ -3398,11 +3408,24 @@ packages: acorn: 8.8.0 dev: true + /acorn-node/1.8.2: + resolution: {integrity: sha512-8mt+fslDufLYntIoPAaIMUe/lrbrehIiwmR3t2k9LljIzoigEPF27eLk2hy8zSGzmR/ogr7zbRKINMo1u0yh5A==} + dependencies: + acorn: 7.4.1 + acorn-walk: 7.2.0 + xtend: 4.0.2 + dev: true + /acorn-walk/6.2.0: resolution: {integrity: sha512-7evsyfH1cLOCdAzZAd43Cic04yKydNx0cF+7tiA19p1XnLLPU4dpCQOqpjqwokFe//vS0QqfqqjCS2JkiIs0cA==} engines: {node: '>=0.4.0'} dev: true + /acorn-walk/7.2.0: + resolution: {integrity: sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==} + engines: {node: '>=0.4.0'} + dev: true + /acorn/5.7.4: resolution: {integrity: sha512-1D++VG7BhrtvQpNbBzovKNc1FLGGEE/oGe7b9xJm/RFHMBeUaUGpluV9RLjZa47YFdPcDAenEYuq9pQPcMdLJg==} engines: {node: '>=0.4.0'} @@ -3605,6 +3628,10 @@ packages: resolution: {integrity: sha512-Xg+9RwCg/0p32teKdGMPTPnVXKD0w3DfHnFTficozsAgsvq2XenPJq/MYpzzQ/v8zrOyJn6Ds39VA4JIDwFfqw==} dev: true + /arg/5.0.2: + resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==} + dev: true + /argparse/1.0.10: resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==} dependencies: @@ -3856,6 +3883,22 @@ packages: hasBin: true dev: true + /autoprefixer/10.4.12_postcss@8.4.18: + resolution: {integrity: sha512-WrCGV9/b97Pa+jtwf5UGaRjgQIg7OK3D06GnoYoZNcG1Xb8Gt3EfuKjlhh9i/VtT16g6PYjZ69jdJ2g8FxSC4Q==} + engines: {node: ^10 || ^12 || >=14} + hasBin: true + peerDependencies: + postcss: ^8.1.0 + dependencies: + browserslist: 4.21.4 + caniuse-lite: 1.0.30001419 + fraction.js: 4.2.0 + normalize-range: 0.1.2 + picocolors: 1.0.0 + postcss: 8.4.18 + postcss-value-parser: 4.2.0 + dev: true + /autoprefixer/9.7.1: resolution: {integrity: sha512-w3b5y1PXWlhYulevrTJ0lizkQ5CyqfeU6BIRDbuhsMupstHQOeb1Ur80tcB1zxSu7AwyY/qCQ7Vvqklh31ZBFw==} engines: {node: '>=6.0.0'} @@ -4443,6 +4486,11 @@ packages: upper-case: 1.1.3 dev: true + /camelcase-css/2.0.1: + resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==} + engines: {node: '>= 6'} + dev: true + /camelcase-keys/2.1.0: resolution: {integrity: sha512-bA/Z/DERHKqoEOrp+qeGKw1QlvEQkGZSc0XaY6VnTxZr+Kv1G5zFwttpjv8qxZ/sBPT4nthwZaAcsAZTJlSKXQ==} engines: {node: '>=0.10.0'} @@ -5606,6 +5654,10 @@ packages: isobject: 3.0.1 dev: true + /defined/1.0.1: + resolution: {integrity: sha512-hsBd2qSVCRE+5PmNdHt1uzyrFu5d3RwmFDKzyNZMFq/EwDNJF7Ee5+D5oEKF0hU6LhtoUF1macFvOe4AskQC1Q==} + dev: true + /del/2.2.2: resolution: {integrity: sha512-Z4fzpbIRjOu7lO5jCETSWoqUDVe0IPOlfugBsF6suen2LKDlVb4QZpKEM9P+buNJ4KI1eN7I083w/pbKUpsrWQ==} engines: {node: '>=0.10.0'} @@ -5696,6 +5748,16 @@ packages: resolution: {integrity: sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==} dev: true + /detective/5.2.1: + resolution: {integrity: sha512-v9XE1zRnz1wRtgurGu0Bs8uHKFSTdteYZNbIPFVhUZ39L/S79ppMpdmVOZAnoz1jfEFodc48n6MX483Xo3t1yw==} + engines: {node: '>=0.8.0'} + hasBin: true + dependencies: + acorn-node: 1.8.2 + defined: 1.0.1 + minimist: 1.2.7 + dev: true + /dezalgo/1.0.4: resolution: {integrity: sha512-rXSP0bf+5n0Qonsb+SVVfNfIsimO4HEtmnIpPHY8Q1UCzKlQrDMfdobr8nJOOsRgWCyMRqeSBQzmWUMq7zvVig==} dependencies: @@ -5703,6 +5765,10 @@ packages: wrappy: 1.0.2 dev: true + /didyoumean/1.2.2: + resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==} + dev: true + /diff-sequences/25.2.6: resolution: {integrity: sha512-Hq8o7+6GaZeoFjtpgvRBUknSXNeJiCx7V9Fr94ZMljNiCr9n9L8H8aJqgWOQiDDGdyn29fRNcDdRVJ5fdyihfg==} engines: {node: '>= 8.3'} @@ -5723,6 +5789,10 @@ packages: path-type: 4.0.0 dev: true + /dlv/1.1.3: + resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==} + dev: true + /dns-equal/1.0.0: resolution: {integrity: sha512-z+paD6YUQsk+AbGCEM4PrOXSss5gd66QfcVBFTKR/HpFL9jCqikS94HYwKww6fQyO7IxrIIyUu+g0Ka9tUS2Cg==} dev: true @@ -7029,6 +7099,10 @@ packages: engines: {node: '>= 0.6'} dev: true + /fraction.js/4.2.0: + resolution: {integrity: sha512-MhLuK+2gUcnZe8ZHlaaINnQLl0xRIGRfcGk2yl8xoQAfHrSsL3rYu6FCmBdkdbhc9EPlwyGHewaRsvwRMJtAlA==} + dev: true + /fragment-cache/0.2.1: resolution: {integrity: sha512-GMBAbW9antB8iZRHLoGw0b3HANt57diZYFO/HL1JGIC1MjKrdmhxvrJbupnVvpys0zsz7yBApXdQyfepKly2kA==} engines: {node: '>=0.10.0'} @@ -7502,6 +7576,21 @@ packages: through2: 2.0.5 dev: true + /gulp-postcss/9.0.1_postcss@8.4.18: + resolution: {integrity: sha512-9QUHam5JyXwGUxaaMvoFQVT44tohpEFpM8xBdPfdwTYGM0AItS1iTQz0MpsF8Jroh7GF5Jt2GVPaYgvy8qD2Fw==} + engines: {node: ^10 || ^12 || >=14} + peerDependencies: + postcss: ^8.0.0 + dependencies: + fancy-log: 1.3.3 + plugin-error: 1.0.1 + postcss: 8.4.18 + postcss-load-config: 3.1.4_postcss@8.4.18 + vinyl-sourcemaps-apply: 0.2.1 + transitivePeerDependencies: + - ts-node + dev: true + /gulp-util/3.0.8: resolution: {integrity: sha512-q5oWPc12lwSFS9h/4VIjG+1NuNDlJ48ywV2JKItY4Ycc/n1fXJeYPVQsfu5ZrhQi7FGSDBalwUCLar/GyHXKGw==} engines: {node: '>=0.10'} @@ -9468,6 +9557,11 @@ packages: - supports-color dev: true + /lilconfig/2.0.6: + resolution: {integrity: sha512-9JROoBW7pobfsx+Sq2JsASvCo6Pfo6WWoUW79HuB1BCoBXD4PLWJPqDF6fNj67pqBYTbAHkE57M1kS/+L1neOg==} + engines: {node: '>=10'} + dev: true + /line-diff/2.1.1: resolution: {integrity: sha512-vswdynAI5AMPJacOo2o+JJ4caDJbnY2NEqms4MhMW0NJbjh3skP/brpVTAgBxrg55NRZ2Vtw88ef18hnagIpYQ==} dependencies: @@ -10470,6 +10564,11 @@ packages: kind-of: 3.2.2 dev: true + /object-hash/3.0.0: + resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==} + engines: {node: '>= 6'} + dev: true + /object-inspect/1.12.2: resolution: {integrity: sha512-z+cPxW0QGUp0mcqcsgQyLVRDoXFQbXOwBaqyF7VIgI4TWNQsDHrBpUQslRmIfAoYWdYzs6UlKJtB2XJpTaNSpQ==} dev: true @@ -11100,6 +11199,16 @@ packages: find-up: 4.1.0 dev: true + /plugin-error/1.0.1: + resolution: {integrity: sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==} + engines: {node: '>= 0.10'} + dependencies: + ansi-colors: 1.1.0 + arr-diff: 4.0.0 + arr-union: 3.1.0 + extend-shallow: 3.0.2 + dev: true + /plugin-log/0.1.0: resolution: {integrity: sha512-TzmfWRMEFAnrZbI4GfyXv9Gp5E71eby3gmvnP6LEfmYbVC8FPN2RBRhwxg4sjIg+fy8AJ3mczhLXvk0pzHPeMg==} engines: {node: '>= 0.9.0'} @@ -11184,6 +11293,40 @@ packages: postcss: 7.0.39 dev: true + /postcss-import/14.1.0_postcss@8.4.18: + resolution: {integrity: sha512-flwI+Vgm4SElObFVPpTIT7SU7R3qk2L7PyduMcokiaVKuWv9d/U+Gm/QAd8NDLuykTWTkcrjOeD2Pp1rMeBTGw==} + engines: {node: '>=10.0.0'} + peerDependencies: + postcss: ^8.0.0 + dependencies: + postcss: 8.4.18 + postcss-value-parser: 4.2.0 + read-cache: 1.0.0 + resolve: 1.22.1 + dev: true + + /postcss-import/15.0.0_postcss@8.4.18: + resolution: {integrity: sha512-Y20shPQ07RitgBGv2zvkEAu9bqvrD77C9axhj/aA1BQj4czape2MdClCExvB27EwYEJdGgKZBpKanb0t1rK2Kg==} + engines: {node: '>=14.0.0'} + peerDependencies: + postcss: ^8.0.0 + dependencies: + postcss: 8.4.18 + postcss-value-parser: 4.2.0 + read-cache: 1.0.0 + resolve: 1.22.1 + dev: true + + /postcss-js/4.0.0_postcss@8.4.18: + resolution: {integrity: sha512-77QESFBwgX4irogGVPgQ5s07vLvFqWr228qZY+w6lW599cRlK/HmnlivnnVUxkjHnCu4J16PDMHcH+e+2HbvTQ==} + engines: {node: ^12 || ^14 || >= 16} + peerDependencies: + postcss: ^8.3.3 + dependencies: + camelcase-css: 2.0.1 + postcss: 8.4.18 + dev: true + /postcss-load-config/2.1.2: resolution: {integrity: sha512-/rDeGV6vMUo3mwJZmeHfEDvwnTKKqQ0S7OHUi/kJvvtx3aWtyWG2/0ZWnzCt2keEclwN6Tf0DST2v9kITdOKYw==} engines: {node: '>= 4'} @@ -11192,6 +11335,23 @@ packages: import-cwd: 2.1.0 dev: true + /postcss-load-config/3.1.4_postcss@8.4.18: + resolution: {integrity: sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==} + engines: {node: '>= 10'} + peerDependencies: + postcss: '>=8.0.9' + ts-node: '>=9.0.0' + peerDependenciesMeta: + postcss: + optional: true + ts-node: + optional: true + dependencies: + lilconfig: 2.0.6 + postcss: 8.4.18 + yaml: 1.10.2 + dev: true + /postcss-loader/3.0.0: resolution: {integrity: sha512-cLWoDEY5OwHcAjDnkyRQzAXfs2jrKjXpO/HQFcc5b5u/r7aa471wdmChmwfnv7x2u840iat/wi0lQ5nbRgSkUA==} engines: {node: '>= 6'} @@ -11415,6 +11575,16 @@ packages: string-hash: 1.1.3 dev: true + /postcss-nested/5.0.6_postcss@8.4.18: + resolution: {integrity: sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==} + engines: {node: '>=12.0'} + peerDependencies: + postcss: ^8.2.14 + dependencies: + postcss: 8.4.18 + postcss-selector-parser: 6.0.10 + dev: true + /postcss-normalize-charset/4.0.1: resolution: {integrity: sha512-gMXCrrlWh6G27U0hF3vNvR3w8I1s2wOBILvA87iNXaPvSNo5uZAMYsZG7XjCUf1eVxuPfyL4TJ7++SGZLc9A3g==} engines: {node: '>=6.9.0'} @@ -11809,6 +11979,11 @@ packages: resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==} dev: true + /quick-lru/5.1.1: + resolution: {integrity: sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA==} + engines: {node: '>=10'} + dev: true + /ramda/0.27.2: resolution: {integrity: sha512-SbiLPU40JuJniHexQSAgad32hfwd+DRUdwF2PlVuI5RZD0/vahUco7R8vD86J/tcEKKF9vZrUVwgtmGCqlCKyA==} dev: true @@ -11908,6 +12083,12 @@ packages: prop-types: 15.8.1 dev: false + /read-cache/1.0.0: + resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==} + dependencies: + pify: 2.3.0 + dev: true + /read-package-json/2.1.2: resolution: {integrity: sha512-D1KmuLQr6ZSJS0tW8hf3WGpRlwszJOXZ3E8Yd/DNRaM5d+1wVRZdHlpGBLAuovjr28LbWvjpWkBHMxpRGGjzNA==} dependencies: @@ -13609,6 +13790,37 @@ packages: resolution: {integrity: sha512-IUW+ek7apEaW5bFhS6WpYoNtVpNTlNoqB/PH7YiMWQTxSPeXCzG4PILVakwXivJt3ZXWeO1fIJnUd/L9A/VeGA==} dev: true + /tailwindcss/3.1.8: + resolution: {integrity: sha512-YSneUCZSFDYMwk+TGq8qYFdCA3yfBRdBlS7txSq0LUmzyeqRe3a8fBQzbz9M3WS/iFT4BNf/nmw9mEzrnSaC0g==} + engines: {node: '>=12.13.0'} + hasBin: true + dependencies: + arg: 5.0.2 + chokidar: 3.5.3 + color-name: 1.1.4 + detective: 5.2.1 + didyoumean: 1.2.2 + dlv: 1.1.3 + fast-glob: 3.2.12 + glob-parent: 6.0.2 + is-glob: 4.0.3 + lilconfig: 2.0.6 + normalize-path: 3.0.0 + object-hash: 3.0.0 + picocolors: 1.0.0 + postcss: 8.4.18 + postcss-import: 14.1.0_postcss@8.4.18 + postcss-js: 4.0.0_postcss@8.4.18 + postcss-load-config: 3.1.4_postcss@8.4.18 + postcss-nested: 5.0.6_postcss@8.4.18 + postcss-selector-parser: 6.0.10 + postcss-value-parser: 4.2.0 + quick-lru: 5.1.1 + resolve: 1.22.1 + transitivePeerDependencies: + - ts-node + dev: true + /tapable/1.1.3: resolution: {integrity: sha512-4WK/bYZmj8xLr+HUCODHGF1ZFzsYffasLUgEiMBY4fgtltdO6B4WJtlSbPaDTLpYTcGVwM2qLnFTICEcNxs3kA==} engines: {node: '>=6'} @@ -14353,6 +14565,12 @@ packages: vinyl: 2.2.1 dev: true + /vinyl-sourcemaps-apply/0.2.1: + resolution: {integrity: sha512-+oDh3KYZBoZC8hfocrbrxbLUeaYtQK7J5WU5Br9VqWqmCll3tFJqKp97GC9GmMsVIL0qnx2DgEDVxdo5EZ5sSw==} + dependencies: + source-map: 0.5.7 + dev: true + /vinyl/0.5.3: resolution: {integrity: sha512-P5zdf3WB9uzr7IFoVQ2wZTmUwHL8cMZWJGzLBNCHNZ3NB6HTMsYABtt7z8tAGIINLXyAob9B9a1yzVGMFOYKEA==} engines: {node: '>= 0.9'} diff --git a/samples/react-associated-hub-links/postcss.config.js b/samples/react-associated-hub-links/postcss.config.js new file mode 100644 index 000000000..96bb01e7d --- /dev/null +++ b/samples/react-associated-hub-links/postcss.config.js @@ -0,0 +1,6 @@ +module.exports = { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +} \ No newline at end of file diff --git a/samples/react-associated-hub-links/src/webparts/reactAssociatedHubLinks/ReactAssociatedHubLinksWebPart.ts b/samples/react-associated-hub-links/src/webparts/reactAssociatedHubLinks/ReactAssociatedHubLinksWebPart.ts index fb4ff5562..0a74f30a1 100644 --- a/samples/react-associated-hub-links/src/webparts/reactAssociatedHubLinks/ReactAssociatedHubLinksWebPart.ts +++ b/samples/react-associated-hub-links/src/webparts/reactAssociatedHubLinks/ReactAssociatedHubLinksWebPart.ts @@ -6,6 +6,7 @@ import { PropertyPaneTextField } from '@microsoft/sp-property-pane'; import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base'; +import '../../../assets/dist/tailwind.css'; import * as strings from 'ReactAssociatedHubLinksWebPartStrings'; import ReactAssociatedHubLinks from './components/ReactAssociatedHubLinks'; diff --git a/samples/react-associated-hub-links/src/webparts/reactAssociatedHubLinks/components/ReactAssociatedHubLinks.tsx b/samples/react-associated-hub-links/src/webparts/reactAssociatedHubLinks/components/ReactAssociatedHubLinks.tsx index fa7be70c7..9256431d9 100644 --- a/samples/react-associated-hub-links/src/webparts/reactAssociatedHubLinks/components/ReactAssociatedHubLinks.tsx +++ b/samples/react-associated-hub-links/src/webparts/reactAssociatedHubLinks/components/ReactAssociatedHubLinks.tsx @@ -14,7 +14,7 @@ export default class ReactAssociatedHubLinks extends React.Component +

Well done, {escape(userDisplayName)}!

diff --git a/samples/react-associated-hub-links/tailwind.config.js b/samples/react-associated-hub-links/tailwind.config.js new file mode 100644 index 000000000..19b190c08 --- /dev/null +++ b/samples/react-associated-hub-links/tailwind.config.js @@ -0,0 +1,9 @@ +/** @type {import('tailwindcss').Config} */ +module.exports = { + prefix: 'tw-', + content: ["./src/**/*.{html,js,ts,tsx}"], + theme: { + extend: {}, + }, + plugins: [], +} \ No newline at end of file