From 759ec6707ac598a38562a9be2778ca83d54868ba Mon Sep 17 00:00:00 2001 From: lawvs <18554747+lawvs@users.noreply.github.com> Date: Mon, 6 Feb 2023 17:37:26 +0800 Subject: [PATCH] feat: add @emotion/babel-plugin --- packages/app/.babelrc.js | 15 ++++++++++++++ packages/app/package.json | 1 + pnpm-lock.yaml | 42 +++++++++++++++++++-------------------- 3 files changed, 36 insertions(+), 22 deletions(-) diff --git a/packages/app/.babelrc.js b/packages/app/.babelrc.js index a801fd94ff..e98989a64f 100644 --- a/packages/app/.babelrc.js +++ b/packages/app/.babelrc.js @@ -7,6 +7,21 @@ if (process.env.NODE_ENV === 'development' || process.env.COVERAGE === 'true') { plugins.push('istanbul'); } +plugins.push([ + '@emotion', + { + // See https://emotion.sh/docs/@emotion/babel-plugin + importMap: { + '@/styles': { + styled: { + canonicalImport: ['@emotion/styled', 'default'], + styledBaseImport: ['@/styles', 'styled'], + }, + }, + }, + }, +]); + module.exports = { presets: ['next/babel'], plugins, diff --git a/packages/app/package.json b/packages/app/package.json index 8277f07a48..fdd8586437 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -39,6 +39,7 @@ "yjs": "^13.5.44" }, "devDependencies": { + "@emotion/babel-plugin": "^11.10.5", "@types/node": "18.7.18", "@types/react": "18.0.20", "@types/react-dom": "18.0.6", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f00882f360..d58b2a44ff 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -52,6 +52,7 @@ importers: '@blocksuite/editor': 0.4.0-20230205175611-17a62e3 '@blocksuite/icons': ^2.0.2 '@blocksuite/store': 0.4.0-20230205175611-17a62e3 + '@emotion/babel-plugin': ^11.10.5 '@emotion/css': ^11.10.0 '@emotion/react': ^11.10.4 '@emotion/server': ^11.10.0 @@ -116,6 +117,7 @@ importers: react-dom: 18.2.0_react@18.2.0 yjs: 13.5.44 devDependencies: + '@emotion/babel-plugin': 11.10.5 '@types/node': 18.7.18 '@types/react': 18.0.20 '@types/react-dom': 18.0.6 @@ -441,11 +443,11 @@ packages: /@babel/helper-plugin-utils/7.19.0: resolution: {integrity: sha512-40Ryx7I8mT+0gaNxm8JGTZFUITNqdLAgdg0hXzeVZxVD6nFsdhQvip6v8dqkRHzsz1VFpFAaOCHNn0vKBL7Czw==} engines: {node: '>=6.9.0'} + dev: true /@babel/helper-plugin-utils/7.20.2: resolution: {integrity: sha512-8RvlJG2mj4huQ4pZ+rU9lqKi9ZKiRmuvGuM2HlWmkmgOhbs6zEAw6IEiJ5cQqGbDzGZOhwuOQNtZMi/ENLjZoQ==} engines: {node: '>=6.9.0'} - dev: true /@babel/helper-remap-async-to-generator/7.18.9_@babel+core@7.20.5: resolution: {integrity: sha512-dI7q50YKd8BAv3VEfgg7PS7yD3Rtbi2J1XMXaalXO0W0164hYLnh8zpjRS0mte9MfVp/tltvr/cfdXPvJr1opA==} @@ -834,8 +836,7 @@ packages: peerDependencies: '@babel/core': ^7.0.0-0 dependencies: - '@babel/helper-plugin-utils': 7.19.0 - dev: false + '@babel/helper-plugin-utils': 7.20.2 /@babel/plugin-syntax-logical-assignment-operators/7.10.4_@babel+core@7.20.5: resolution: {integrity: sha512-d8waShlpFDinQ5MtvGU9xDAOzKH47+FFoney2baFIoMr952hKOLp1HR7VszoZvOsV/4+RRszNY7D17ba0te0ig==} @@ -1840,8 +1841,8 @@ packages: '@jridgewell/trace-mapping': 0.3.9 dev: true - /@emotion/babel-plugin/11.10.2: - resolution: {integrity: sha512-xNQ57njWTFVfPAc3cjfuaPdsgLp5QOSuRsj9MA6ndEhH/AzuZM86qIQzt6rq+aGBwj3n5/TkLmU5lhAfdRmogA==} + /@emotion/babel-plugin/11.10.5: + resolution: {integrity: sha512-xE7/hyLHJac7D2Ve9dKroBBZqBT7WuPQmWcq7HSGb84sUuP4mlOWoB8dvVfD9yk5DHkU1m6RW7xSoDtnQHNQeA==} peerDependencies: '@babel/core': ^7.0.0 dependencies: @@ -1850,14 +1851,13 @@ packages: '@babel/runtime': 7.20.7 '@emotion/hash': 0.9.0 '@emotion/memoize': 0.8.0 - '@emotion/serialize': 1.1.0 + '@emotion/serialize': 1.1.1 babel-plugin-macros: 3.1.0 convert-source-map: 1.9.0 escape-string-regexp: 4.0.0 find-root: 1.1.0 source-map: 0.5.7 - stylis: 4.0.13 - dev: false + stylis: 4.1.3 /@emotion/cache/11.10.3: resolution: {integrity: sha512-Psmp/7ovAa8appWh3g51goxu/z3iVms7JXOreq136D8Bbn6dYraPnmL6mdM8GThEx9vwSn92Fz+mGSjBzN8UPQ==} @@ -1887,7 +1887,7 @@ packages: '@babel/core': optional: true dependencies: - '@emotion/babel-plugin': 11.10.2 + '@emotion/babel-plugin': 11.10.5 '@emotion/cache': 11.10.3 '@emotion/serialize': 1.1.0 '@emotion/sheet': 1.2.0 @@ -1896,7 +1896,6 @@ packages: /@emotion/hash/0.9.0: resolution: {integrity: sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ==} - dev: false /@emotion/is-prop-valid/1.2.0: resolution: {integrity: sha512-3aDpDprjM0AwaxGE09bOPkNxHpBd+kA6jty3RnaEXdweX1DF1U3VQpPYb0g1IStAuK7SVQ1cy+bNBBKp4W3Fjg==} @@ -1906,7 +1905,6 @@ packages: /@emotion/memoize/0.8.0: resolution: {integrity: sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA==} - dev: false /@emotion/react/11.10.4_w5j4k42lgipnm43s3brx6h3c34: resolution: {integrity: sha512-j0AkMpr6BL8gldJZ6XQsQ8DnS9TxEQu1R+OGmDZiWjBAJtCcbt0tS3I/YffoqHXxH6MjgI7KdMbYKw3MEiU9eA==} @@ -1921,7 +1919,7 @@ packages: optional: true dependencies: '@babel/runtime': 7.19.0 - '@emotion/babel-plugin': 11.10.2 + '@emotion/babel-plugin': 11.10.5 '@emotion/cache': 11.10.3 '@emotion/serialize': 1.1.0 '@emotion/use-insertion-effect-with-fallbacks': 1.0.0_react@18.2.0 @@ -1942,6 +1940,15 @@ packages: csstype: 3.1.1 dev: false + /@emotion/serialize/1.1.1: + resolution: {integrity: sha512-Zl/0LFggN7+L1liljxXdsVSVlg6E/Z/olVWpfxUTxOAmi8NU7YoeWeLfi1RmnB2TATHoaWwIBRoL+FvAJiTUQA==} + dependencies: + '@emotion/hash': 0.9.0 + '@emotion/memoize': 0.8.0 + '@emotion/unitless': 0.8.0 + '@emotion/utils': 1.2.0 + csstype: 3.1.1 + /@emotion/server/11.10.0_@emotion+css@11.10.0: resolution: {integrity: sha512-MTvJ21JPo9aS02GdjFW4nhdwOi2tNNpMmAM/YED0pkxzjDNi5WbiTwXqaCnvLc2Lr8NFtjhT0az1vTJyLIHYcw==} peerDependencies: @@ -1979,7 +1986,7 @@ packages: optional: true dependencies: '@babel/runtime': 7.19.0 - '@emotion/babel-plugin': 11.10.2 + '@emotion/babel-plugin': 11.10.5 '@emotion/is-prop-valid': 1.2.0 '@emotion/react': 11.10.4_w5j4k42lgipnm43s3brx6h3c34 '@emotion/serialize': 1.1.0 @@ -1991,7 +1998,6 @@ packages: /@emotion/unitless/0.8.0: resolution: {integrity: sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw==} - dev: false /@emotion/use-insertion-effect-with-fallbacks/1.0.0_react@18.2.0: resolution: {integrity: sha512-1eEgUGmkaljiBnRMTdksDV1W4kUnmwgp7X9G8B++9GYwl1lUdqSndSriIrTJ0N7LQaoauY9JJ2yhiOYK5+NI4A==} @@ -2003,7 +2009,6 @@ packages: /@emotion/utils/1.2.0: resolution: {integrity: sha512-sn3WH53Kzpw8oQ5mgMmIzzyAaH2ZqFEbozVVBSYp538E06OSE6ytOp7pRAjNQR+Q/orwqdQYJSe2m3hCOeznkw==} - dev: false /@emotion/weak-memoize/0.3.0: resolution: {integrity: sha512-AHPmaAx+RYfZz0eYu6Gviiagpmiyw98ySSlQvCUhVGDRtDFe4DBS0x1bSjdF3gqUDYOczB+yYvBTtEylYSdRhg==} @@ -3541,7 +3546,6 @@ packages: /@types/parse-json/4.0.0: resolution: {integrity: sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==} - dev: false /@types/prettier/2.7.2: resolution: {integrity: sha512-KufADq8uQqo1pYKVIYzfKbJfBAc0sOeXqGbFaSpv8MRmC/zXgowNZmFcbngndGk922QDmOASEXUZCaY48gs4cg==} @@ -4040,7 +4044,6 @@ packages: '@babel/runtime': 7.20.7 cosmiconfig: 7.0.1 resolve: 1.22.1 - dev: false /babel-plugin-polyfill-corejs2/0.3.3_@babel+core@7.20.5: resolution: {integrity: sha512-8hOdmFYFSZhqg2C/JgLUQ+t52o5nirNwaWM2B9LWteozwIvM14VSwdsCAUET10qT+kmySAlseadmfeeSWFCy+Q==} @@ -4407,7 +4410,6 @@ packages: parse-json: 5.2.0 path-type: 4.0.0 yaml: 1.10.2 - dev: false /create-require/1.1.1: resolution: {integrity: sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==} @@ -5510,7 +5512,6 @@ packages: /find-root/1.1.0: resolution: {integrity: sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==} - dev: false /find-up/4.1.0: resolution: {integrity: sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==} @@ -8147,7 +8148,6 @@ packages: /source-map/0.5.7: resolution: {integrity: sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==} engines: {node: '>=0.10.0'} - dev: false /source-map/0.6.1: resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==} @@ -8405,7 +8405,6 @@ packages: /stylis/4.1.3: resolution: {integrity: sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA==} - dev: false /supports-color/5.5.0: resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==} @@ -9231,7 +9230,6 @@ packages: /yaml/1.10.2: resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==} engines: {node: '>= 6'} - dev: false /yaml/2.2.1: resolution: {integrity: sha512-e0WHiYql7+9wr4cWMx3TVQrNwejKaEe7/rHNmQmqRjazfOP5W8PB6Jpebb5o6fIapbz9o9+2ipcaTM2ZwDI6lw==}