From a9573ea95777cd670d5f781f23609b0671044e4c Mon Sep 17 00:00:00 2001
From: hooray <304327508@qq.com>
Date: Thu, 20 Jan 2022 02:13:11 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0jsx=E6=94=AF=E6=8C=81?=
=?UTF-8?q?=EF=BC=8C=E4=BB=A5=E5=8F=8A=E6=BC=94=E7=A4=BA=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.eslintrc.js | 6 +
.lintstagedrc | 2 +-
package.json | 1 +
pnpm-lock.yaml | 427 +++++++++++++++++-
src/assets/icons/sidebar-jsx.svg | 1 +
src/router/index.js | 2 +
src/router/modules/jsx.example.js | 25 +
.../jsx_example/components/JsxComp/index.vue | 20 +
src/views/jsx_example/index.jsx | 47 ++
src/views/jsx_example/index.module.scss | 19 +
vite/plugins/components.js | 3 +-
vite/plugins/index.js | 2 +
vite/plugins/jsx.js | 5 +
vite/plugins/restart.js | 1 +
14 files changed, 540 insertions(+), 21 deletions(-)
create mode 100644 src/assets/icons/sidebar-jsx.svg
create mode 100644 src/router/modules/jsx.example.js
create mode 100644 src/views/jsx_example/components/JsxComp/index.vue
create mode 100644 src/views/jsx_example/index.jsx
create mode 100644 src/views/jsx_example/index.module.scss
create mode 100644 vite/plugins/jsx.js
diff --git a/.eslintrc.js b/.eslintrc.js
index 18784b2..43c20ae 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -18,6 +18,12 @@ module.exports = {
'./auto-import-eslint-config.js'
],
parser: 'vue-eslint-parser',
+ parserOptions: {
+ ecmaVersion: '2020',
+ ecmaFeatures: {
+ jsx: true
+ }
+ },
rules: {
// 代码风格
'block-spacing': [2, 'always'],
diff --git a/.lintstagedrc b/.lintstagedrc
index 252e58c..5b5e299 100644
--- a/.lintstagedrc
+++ b/.lintstagedrc
@@ -1,5 +1,5 @@
{
- "src/**/*.js": "eslint --fix",
+ "src/**/*.{js,jsx}": "eslint --fix",
"src/**/*.{css,scss}": "stylelint --fix",
"src/**/*.vue": ["eslint --fix", "stylelint --fix"]
}
diff --git a/package.json b/package.json
index 8c2d57c..2bbb4e9 100644
--- a/package.json
+++ b/package.json
@@ -40,6 +40,7 @@
},
"devDependencies": {
"@vitejs/plugin-vue": "^2.0.1",
+ "@vitejs/plugin-vue-jsx": "^1.3.3",
"@vue/compiler-sfc": "^3.2.26",
"eslint": "^8.6.0",
"eslint-plugin-vue": "^8.3.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 0066621..d151818 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -4,6 +4,7 @@ specifiers:
'@element-plus/icons-vue': ^0.2.4
'@tinymce/tinymce-vue': ^4.0.5
'@vitejs/plugin-vue': ^2.0.1
+ '@vitejs/plugin-vue-jsx': ^1.3.3
'@vue/compiler-sfc': ^3.2.26
'@vueuse/core': ^7.5.3
'@vueuse/integrations': ^7.5.3
@@ -77,6 +78,7 @@ dependencies:
devDependencies:
'@vitejs/plugin-vue': 2.0.1_vite@2.7.12+vue@3.2.26
+ '@vitejs/plugin-vue-jsx': 1.3.3
'@vue/compiler-sfc': 3.2.26
eslint: 8.6.0
eslint-plugin-vue: 8.3.0_eslint@8.6.0
@@ -122,23 +124,213 @@ packages:
'@types/throttle-debounce': 2.1.0
dev: true
- /@babel/code-frame/7.16.0:
- resolution: {integrity: sha1-DfyAMJvuyEEeZecGRhxAiwu5tDE=, tarball: '@babel/code-frame/download/@babel/code-frame-7.16.0.tgz'}
+ /@babel/code-frame/7.16.7:
+ resolution: {integrity: sha512-iAXqUn8IIeBTNd72xsFlgaXHkMBMt6y4HJp1tIaK465CWLT/fG1aqB7ykr95gHHmlBdGbFeWWfyB4NJJ0nmeIg==, tarball: '@babel/code-frame/download/@babel/code-frame-7.16.7.tgz'}
engines: {node: '>=6.9.0'}
dependencies:
- '@babel/highlight': 7.16.0
+ '@babel/highlight': 7.16.7
dev: true
- /@babel/helper-validator-identifier/7.15.7:
- resolution: {integrity: sha1-Ig35k7/pBKSmsCq08zhaXr9uI4k=, tarball: '@babel/helper-validator-identifier/download/@babel/helper-validator-identifier-7.15.7.tgz'}
+ /@babel/compat-data/7.16.8:
+ resolution: {integrity: sha512-m7OkX0IdKLKPpBlJtF561YJal5y/jyI5fNfWbPxh2D/nbzzGI4qRyrD8xO2jB24u7l+5I2a43scCG2IrfjC50Q==, tarball: '@babel/compat-data/download/@babel/compat-data-7.16.8.tgz'}
engines: {node: '>=6.9.0'}
dev: true
- /@babel/highlight/7.16.0:
- resolution: {integrity: sha1-bOsysspLj182H7f9gh4/3fShclo=, tarball: '@babel/highlight/download/@babel/highlight-7.16.0.tgz'}
+ /@babel/core/7.16.7:
+ resolution: {integrity: sha512-aeLaqcqThRNZYmbMqtulsetOQZ/5gbR/dWruUCJcpas4Qoyy+QeagfDsPdMrqwsPRDNxJvBlRiZxxX7THO7qtA==, tarball: '@babel/core/download/@babel/core-7.16.7.tgz'}
engines: {node: '>=6.9.0'}
dependencies:
- '@babel/helper-validator-identifier': 7.15.7
+ '@babel/code-frame': 7.16.7
+ '@babel/generator': 7.16.8
+ '@babel/helper-compilation-targets': 7.16.7_@babel+core@7.16.7
+ '@babel/helper-module-transforms': 7.16.7
+ '@babel/helpers': 7.16.7
+ '@babel/parser': 7.16.8
+ '@babel/template': 7.16.7
+ '@babel/traverse': 7.16.8
+ '@babel/types': 7.16.8
+ convert-source-map: 1.8.0
+ debug: 4.3.3
+ gensync: 1.0.0-beta.2
+ json5: 2.2.0
+ semver: 6.3.0
+ source-map: 0.5.7
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /@babel/generator/7.16.8:
+ resolution: {integrity: sha512-1ojZwE9+lOXzcWdWmO6TbUzDfqLD39CmEhN8+2cX9XkDo5yW1OpgfejfliysR2AWLpMamTiOiAp/mtroaymhpw==, tarball: '@babel/generator/download/@babel/generator-7.16.8.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ jsesc: 2.5.2
+ source-map: 0.5.7
+ dev: true
+
+ /@babel/helper-annotate-as-pure/7.16.7:
+ resolution: {integrity: sha512-s6t2w/IPQVTAET1HitoowRGXooX8mCgtuP5195wD/QJPV6wYjpujCGF7JuMODVX2ZAJOf1GT6DT9MHEZvLOFSw==, tarball: '@babel/helper-annotate-as-pure/download/@babel/helper-annotate-as-pure-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-compilation-targets/7.16.7_@babel+core@7.16.7:
+ resolution: {integrity: sha512-mGojBwIWcwGD6rfqgRXVlVYmPAv7eOpIemUG3dGnDdCY4Pae70ROij3XmfrH6Fa1h1aiDylpglbZyktfzyo/hA==, tarball: '@babel/helper-compilation-targets/download/@babel/helper-compilation-targets-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ peerDependencies:
+ '@babel/core': ^7.0.0
+ dependencies:
+ '@babel/compat-data': 7.16.8
+ '@babel/core': 7.16.7
+ '@babel/helper-validator-option': 7.16.7
+ browserslist: 4.19.1
+ semver: 6.3.0
+ dev: true
+
+ /@babel/helper-create-class-features-plugin/7.16.7_@babel+core@7.16.7:
+ resolution: {integrity: sha512-kIFozAvVfK05DM4EVQYKK+zteWvY85BFdGBRQBytRyY3y+6PX0DkDOn/CZ3lEuczCfrCxEzwt0YtP/87YPTWSw==, tarball: '@babel/helper-create-class-features-plugin/download/@babel/helper-create-class-features-plugin-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ peerDependencies:
+ '@babel/core': ^7.0.0
+ dependencies:
+ '@babel/core': 7.16.7
+ '@babel/helper-annotate-as-pure': 7.16.7
+ '@babel/helper-environment-visitor': 7.16.7
+ '@babel/helper-function-name': 7.16.7
+ '@babel/helper-member-expression-to-functions': 7.16.7
+ '@babel/helper-optimise-call-expression': 7.16.7
+ '@babel/helper-replace-supers': 7.16.7
+ '@babel/helper-split-export-declaration': 7.16.7
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /@babel/helper-environment-visitor/7.16.7:
+ resolution: {integrity: sha512-SLLb0AAn6PkUeAfKJCCOl9e1R53pQlGAfc4y4XuMRZfqeMYLE0dM1LMhqbGAlGQY0lfw5/ohoYWAe9V1yibRag==, tarball: '@babel/helper-environment-visitor/download/@babel/helper-environment-visitor-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-function-name/7.16.7:
+ resolution: {integrity: sha512-QfDfEnIUyyBSR3HtrtGECuZ6DAyCkYFp7GHl75vFtTnn6pjKeK0T1DB5lLkFvBea8MdaiUABx3osbgLyInoejA==, tarball: '@babel/helper-function-name/download/@babel/helper-function-name-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/helper-get-function-arity': 7.16.7
+ '@babel/template': 7.16.7
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-get-function-arity/7.16.7:
+ resolution: {integrity: sha512-flc+RLSOBXzNzVhcLu6ujeHUrD6tANAOU5ojrRx/as+tbzf8+stUCj7+IfRRoAbEZqj/ahXEMsjhOhgeZsrnTw==, tarball: '@babel/helper-get-function-arity/download/@babel/helper-get-function-arity-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-hoist-variables/7.16.7:
+ resolution: {integrity: sha512-m04d/0Op34H5v7pbZw6pSKP7weA6lsMvfiIAMeIvkY/R4xQtBSMFEigu9QTZ2qB/9l22vsxtM8a+Q8CzD255fg==, tarball: '@babel/helper-hoist-variables/download/@babel/helper-hoist-variables-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-member-expression-to-functions/7.16.7:
+ resolution: {integrity: sha512-VtJ/65tYiU/6AbMTDwyoXGPKHgTsfRarivm+YbB5uAzKUyuPjgZSgAFeG87FCigc7KNHu2Pegh1XIT3lXjvz3Q==, tarball: '@babel/helper-member-expression-to-functions/download/@babel/helper-member-expression-to-functions-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-module-imports/7.16.7:
+ resolution: {integrity: sha512-LVtS6TqjJHFc+nYeITRo6VLXve70xmq7wPhWTqDJusJEgGmkAACWwMiTNrvfoQo6hEhFwAIixNkvB0jPXDL8Wg==, tarball: '@babel/helper-module-imports/download/@babel/helper-module-imports-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-module-transforms/7.16.7:
+ resolution: {integrity: sha512-gaqtLDxJEFCeQbYp9aLAefjhkKdjKcdh6DB7jniIGU3Pz52WAmP268zK0VgPz9hUNkMSYeH976K2/Y6yPadpng==, tarball: '@babel/helper-module-transforms/download/@babel/helper-module-transforms-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/helper-environment-visitor': 7.16.7
+ '@babel/helper-module-imports': 7.16.7
+ '@babel/helper-simple-access': 7.16.7
+ '@babel/helper-split-export-declaration': 7.16.7
+ '@babel/helper-validator-identifier': 7.16.7
+ '@babel/template': 7.16.7
+ '@babel/traverse': 7.16.8
+ '@babel/types': 7.16.8
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /@babel/helper-optimise-call-expression/7.16.7:
+ resolution: {integrity: sha512-EtgBhg7rd/JcnpZFXpBy0ze1YRfdm7BnBX4uKMBd3ixa3RGAE002JZB66FJyNH7g0F38U05pXmA5P8cBh7z+1w==, tarball: '@babel/helper-optimise-call-expression/download/@babel/helper-optimise-call-expression-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-plugin-utils/7.16.7:
+ resolution: {integrity: sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==, tarball: '@babel/helper-plugin-utils/download/@babel/helper-plugin-utils-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dev: true
+
+ /@babel/helper-replace-supers/7.16.7:
+ resolution: {integrity: sha512-y9vsWilTNaVnVh6xiJfABzsNpgDPKev9HnAgz6Gb1p6UUwf9NepdlsV7VXGCftJM+jqD5f7JIEubcpLjZj5dBw==, tarball: '@babel/helper-replace-supers/download/@babel/helper-replace-supers-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/helper-environment-visitor': 7.16.7
+ '@babel/helper-member-expression-to-functions': 7.16.7
+ '@babel/helper-optimise-call-expression': 7.16.7
+ '@babel/traverse': 7.16.8
+ '@babel/types': 7.16.8
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /@babel/helper-simple-access/7.16.7:
+ resolution: {integrity: sha512-ZIzHVyoeLMvXMN/vok/a4LWRy8G2v205mNP0XOuf9XRLyX5/u9CnVulUtDgUTama3lT+bf/UqucuZjqiGuTS1g==, tarball: '@babel/helper-simple-access/download/@babel/helper-simple-access-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-split-export-declaration/7.16.7:
+ resolution: {integrity: sha512-xbWoy/PFoxSWazIToT9Sif+jJTlrMcndIsaOKvTA6u7QEo7ilkRZpjew18/W3c7nm8fXdUDXh02VXTbZ0pGDNw==, tarball: '@babel/helper-split-export-declaration/download/@babel/helper-split-export-declaration-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/helper-validator-identifier/7.16.7:
+ resolution: {integrity: sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw==, tarball: '@babel/helper-validator-identifier/download/@babel/helper-validator-identifier-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dev: true
+
+ /@babel/helper-validator-option/7.16.7:
+ resolution: {integrity: sha512-TRtenOuRUVo9oIQGPC5G9DgK4743cdxvtOw0weQNpZXaS16SCBi5MNjZF8vba3ETURjZpTbVn7Vvcf2eAwFozQ==, tarball: '@babel/helper-validator-option/download/@babel/helper-validator-option-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dev: true
+
+ /@babel/helpers/7.16.7:
+ resolution: {integrity: sha512-9ZDoqtfY7AuEOt3cxchfii6C7GDyyMBffktR5B2jvWv8u2+efwvpnVKXMWzNehqy68tKgAfSwfdw/lWpthS2bw==, tarball: '@babel/helpers/download/@babel/helpers-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/template': 7.16.7
+ '@babel/traverse': 7.16.8
+ '@babel/types': 7.16.8
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /@babel/highlight/7.16.7:
+ resolution: {integrity: sha512-aKpPMfLvGO3Q97V0qhw/V2SWNWlwfJknuwAunU7wZLSfrM4xTBvg7E5opUVi1kJTBKihE38CPg4nBiqX83PWYw==, tarball: '@babel/highlight/download/@babel/highlight-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/helper-validator-identifier': 7.16.7
chalk: 2.4.2
js-tokens: 4.0.0
dev: true
@@ -148,6 +340,90 @@ packages:
engines: {node: '>=6.0.0'}
hasBin: true
+ /@babel/parser/7.16.8:
+ resolution: {integrity: sha512-i7jDUfrVBWc+7OKcBzEe5n7fbv3i2fWtxKzzCvOjnzSxMfWMigAhtfJ7qzZNGFNMsCCd67+uz553dYKWXPvCKw==, tarball: '@babel/parser/download/@babel/parser-7.16.8.tgz'}
+ engines: {node: '>=6.0.0'}
+ hasBin: true
+ dev: true
+
+ /@babel/plugin-syntax-import-meta/7.10.4_@babel+core@7.16.7:
+ resolution: {integrity: sha1-7mATSMNw+jNNIge+FYd3SWUh/VE=, tarball: '@babel/plugin-syntax-import-meta/download/@babel/plugin-syntax-import-meta-7.10.4.tgz'}
+ peerDependencies:
+ '@babel/core': ^7.0.0-0
+ dependencies:
+ '@babel/core': 7.16.7
+ '@babel/helper-plugin-utils': 7.16.7
+ dev: true
+
+ /@babel/plugin-syntax-jsx/7.16.7_@babel+core@7.16.7:
+ resolution: {integrity: sha512-Esxmk7YjA8QysKeT3VhTXvF6y77f/a91SIs4pWb4H2eWGQkCKFgQaG6hdoEVZtGsrAcb2K5BW66XsOErD4WU3Q==, tarball: '@babel/plugin-syntax-jsx/download/@babel/plugin-syntax-jsx-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ peerDependencies:
+ '@babel/core': ^7.0.0-0
+ dependencies:
+ '@babel/core': 7.16.7
+ '@babel/helper-plugin-utils': 7.16.7
+ dev: true
+
+ /@babel/plugin-syntax-typescript/7.16.7_@babel+core@7.16.7:
+ resolution: {integrity: sha512-YhUIJHHGkqPgEcMYkPCKTyGUdoGKWtopIycQyjJH8OjvRgOYsXsaKehLVPScKJWAULPxMa4N1vCe6szREFlZ7A==, tarball: '@babel/plugin-syntax-typescript/download/@babel/plugin-syntax-typescript-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ peerDependencies:
+ '@babel/core': ^7.0.0-0
+ dependencies:
+ '@babel/core': 7.16.7
+ '@babel/helper-plugin-utils': 7.16.7
+ dev: true
+
+ /@babel/plugin-transform-typescript/7.16.8_@babel+core@7.16.7:
+ resolution: {integrity: sha512-bHdQ9k7YpBDO2d0NVfkj51DpQcvwIzIusJ7mEUaMlbZq3Kt/U47j24inXZHQ5MDiYpCs+oZiwnXyKedE8+q7AQ==, tarball: '@babel/plugin-transform-typescript/download/@babel/plugin-transform-typescript-7.16.8.tgz'}
+ engines: {node: '>=6.9.0'}
+ peerDependencies:
+ '@babel/core': ^7.0.0-0
+ dependencies:
+ '@babel/core': 7.16.7
+ '@babel/helper-create-class-features-plugin': 7.16.7_@babel+core@7.16.7
+ '@babel/helper-plugin-utils': 7.16.7
+ '@babel/plugin-syntax-typescript': 7.16.7_@babel+core@7.16.7
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /@babel/template/7.16.7:
+ resolution: {integrity: sha512-I8j/x8kHUrbYRTUxXrrMbfCa7jxkE7tZre39x3kjr9hvI82cK1FfqLygotcWN5kdPGWcLdWMHpSBavse5tWw3w==, tarball: '@babel/template/download/@babel/template-7.16.7.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/code-frame': 7.16.7
+ '@babel/parser': 7.16.8
+ '@babel/types': 7.16.8
+ dev: true
+
+ /@babel/traverse/7.16.8:
+ resolution: {integrity: sha512-xe+H7JlvKsDQwXRsBhSnq1/+9c+LlQcCK3Tn/l5sbx02HYns/cn7ibp9+RV1sIUqu7hKg91NWsgHurO9dowITQ==, tarball: '@babel/traverse/download/@babel/traverse-7.16.8.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/code-frame': 7.16.7
+ '@babel/generator': 7.16.8
+ '@babel/helper-environment-visitor': 7.16.7
+ '@babel/helper-function-name': 7.16.7
+ '@babel/helper-hoist-variables': 7.16.7
+ '@babel/helper-split-export-declaration': 7.16.7
+ '@babel/parser': 7.16.8
+ '@babel/types': 7.16.8
+ debug: 4.3.3
+ globals: 11.12.0
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /@babel/types/7.16.8:
+ resolution: {integrity: sha512-smN2DQc5s4M7fntyjGtyIPbRJv6wW4rU/94fmYJ7PKQuZkC0qGMHXJbg6sNGt12JmVr4k5YaptI/XtiLJBnmIg==, tarball: '@babel/types/download/@babel/types-7.16.8.tgz'}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ '@babel/helper-validator-identifier': 7.16.7
+ to-fast-properties: 2.0.0
+ dev: true
+
/@ctrl/tinycolor/3.4.0:
resolution: {integrity: sha1-w8WuVDyJfKqcKmhjC+01W+X5mQ8=, tarball: '@ctrl/tinycolor/download/@ctrl/tinycolor-3.4.0.tgz'}
engines: {node: '>=10'}
@@ -353,6 +629,20 @@ packages:
'@types/node': 16.11.12
dev: true
+ /@vitejs/plugin-vue-jsx/1.3.3:
+ resolution: {integrity: sha512-VSBXVqMcxbgX85rgJC1eMWuZ9hzOJhWPvGYlKxyymPokE/i3Gykh5ljkCoNdxnKgIyFqv4WutYoYY93fgjbTxA==, tarball: '@vitejs/plugin-vue-jsx/download/@vitejs/plugin-vue-jsx-1.3.3.tgz'}
+ engines: {node: '>=12.0.0'}
+ dependencies:
+ '@babel/core': 7.16.7
+ '@babel/plugin-syntax-import-meta': 7.10.4_@babel+core@7.16.7
+ '@babel/plugin-transform-typescript': 7.16.8_@babel+core@7.16.7
+ '@rollup/pluginutils': 4.1.2
+ '@vue/babel-plugin-jsx': 1.1.1_@babel+core@7.16.7
+ hash-sum: 2.0.0
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
/@vitejs/plugin-vue/2.0.1_vite@2.7.12+vue@3.2.26:
resolution: {integrity: sha512-wtdMnGVvys9K8tg+DxowU1ytTrdVveXr3LzdhaKakysgGXyrsfaeds2cDywtvujEASjWOwWL/OgWM+qoeM8Plg==, tarball: '@vitejs/plugin-vue/download/@vitejs/plugin-vue-2.0.1.tgz'}
engines: {node: '>=12.0.0'}
@@ -364,6 +654,27 @@ packages:
vue: 3.2.26
dev: true
+ /@vue/babel-helper-vue-transform-on/1.0.2:
+ resolution: {integrity: sha1-m5xpHNBvyFUiGiR1w8yDHXdLx9w=, tarball: '@vue/babel-helper-vue-transform-on/download/@vue/babel-helper-vue-transform-on-1.0.2.tgz'}
+ dev: true
+
+ /@vue/babel-plugin-jsx/1.1.1_@babel+core@7.16.7:
+ resolution: {integrity: sha1-DFusJ4gNI/iYlM0Daje1XvYd38E=, tarball: '@vue/babel-plugin-jsx/download/@vue/babel-plugin-jsx-1.1.1.tgz'}
+ dependencies:
+ '@babel/helper-module-imports': 7.16.7
+ '@babel/plugin-syntax-jsx': 7.16.7_@babel+core@7.16.7
+ '@babel/template': 7.16.7
+ '@babel/traverse': 7.16.8
+ '@babel/types': 7.16.8
+ '@vue/babel-helper-vue-transform-on': 1.0.2
+ camelcase: 6.3.0
+ html-tags: 3.1.0
+ svg-tags: 1.0.0
+ transitivePeerDependencies:
+ - '@babel/core'
+ - supports-color
+ dev: true
+
/@vue/compiler-core/3.2.26:
resolution: {integrity: sha512-N5XNBobZbaASdzY9Lga2D9Lul5vdCIOXvUMd6ThcN8zgqQhPKfCV+wfAJNNJKQkSHudnYRO2gEB+lp0iN3g2Tw==, tarball: '@vue/compiler-core/download/@vue/compiler-core-3.2.26.tgz'}
dependencies:
@@ -568,12 +879,12 @@ packages:
dev: true
/ansi-styles/2.2.1:
- resolution: {integrity: sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=, tarball: ansi-styles/download/ansi-styles-2.2.1.tgz}
+ resolution: {integrity: sha512-kmCevFghRiWM7HB5zTPULl4r9bVFSWjz62MhqizDGUrq2NWuNMQyuv4tHHoKJHs69M/MF64lEcHdYIocrdWQYA==, tarball: ansi-styles/download/ansi-styles-2.2.1.tgz}
engines: {node: '>=0.10.0'}
dev: true
/ansi-styles/3.2.1:
- resolution: {integrity: sha1-QfuyAkPlCxK+DwS43tvwdSDOhB0=, tarball: ansi-styles/download/ansi-styles-3.2.1.tgz}
+ resolution: {integrity: sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==, tarball: ansi-styles/download/ansi-styles-3.2.1.tgz}
engines: {node: '>=4'}
dependencies:
color-convert: 1.9.3
@@ -586,7 +897,7 @@ packages:
color-convert: 2.0.1
/ansi-styles/6.1.0:
- resolution: {integrity: sha1-hzE8ECuBGKvVc3GvqzRhi/c1DtM=, tarball: ansi-styles/download/ansi-styles-6.1.0.tgz}
+ resolution: {integrity: sha512-VbqNsoz55SYGczauuup0MFUyXNQviSpFTj1RQtFzmQLk18qbVSpTFFGMT293rmDaQuKCT6InmbuEyUne4mTuxQ==, tarball: ansi-styles/download/ansi-styles-6.1.0.tgz}
engines: {node: '>=12'}
dev: true
@@ -796,6 +1107,18 @@ packages:
fill-range: 7.0.1
dev: true
+ /browserslist/4.19.1:
+ resolution: {integrity: sha512-u2tbbG5PdKRTUoctO3NBD8FQ5HdPh1ZXPHzp1rwaa5jTc+RV9/+RlWiAIKmjRPQF+xbGM9Kklj5bZQFa2s/38A==, tarball: browserslist/download/browserslist-4.19.1.tgz}
+ engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
+ hasBin: true
+ dependencies:
+ caniuse-lite: 1.0.30001300
+ electron-to-chromium: 1.4.48
+ escalade: 3.1.1
+ node-releases: 2.0.1
+ picocolors: 1.0.0
+ dev: true
+
/buffer-from/1.1.2:
resolution: {integrity: sha1-KxRqb9cugLT1XSVfNe1Zo6mkG9U=, tarball: buffer-from/download/buffer-from-1.1.2.tgz}
dev: true
@@ -868,9 +1191,18 @@ packages:
dev: true
/camelcase/5.3.1:
- resolution: {integrity: sha1-48mzFWnhBoEd8kL3FXJaH0xJQyA=, tarball: camelcase/download/camelcase-5.3.1.tgz?cache=0&sync_timestamp=1632825560555&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fcamelcase%2Fdownload%2Fcamelcase-5.3.1.tgz}
+ resolution: {integrity: sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==, tarball: camelcase/download/camelcase-5.3.1.tgz}
engines: {node: '>=6'}
+ /camelcase/6.3.0:
+ resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==, tarball: camelcase/download/camelcase-6.3.0.tgz}
+ engines: {node: '>=10'}
+ dev: true
+
+ /caniuse-lite/1.0.30001300:
+ resolution: {integrity: sha512-cVjiJHWGcNlJi8TZVKNMnvMid3Z3TTdDHmLDzlOdIiZq138Exvo0G+G0wTdVYolxKb4AYwC+38pxodiInVtJSA==, tarball: caniuse-lite/download/caniuse-lite-1.0.30001300.tgz}
+ dev: true
+
/capital-case/1.0.4:
resolution: {integrity: sha1-nRMCkjU8kkn2sA+lhSvuOKcX5mk=, tarball: capital-case/download/capital-case-1.0.4.tgz}
dependencies:
@@ -884,7 +1216,7 @@ packages:
dev: true
/chalk/1.1.3:
- resolution: {integrity: sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=, tarball: chalk/download/chalk-1.1.3.tgz}
+ resolution: {integrity: sha512-U3lRVLMSlsCfjqYPbLyVv11M9CPW4I728d6TCKMAOJueEeB9/8o+eSsMnxPJD+Q+K909sdESg7C+tIkoH6on1A==, tarball: chalk/download/chalk-1.1.3.tgz}
engines: {node: '>=0.10.0'}
dependencies:
ansi-styles: 2.2.1
@@ -895,7 +1227,7 @@ packages:
dev: true
/chalk/2.4.2:
- resolution: {integrity: sha1-zUJUFnelQzPPVBpJEIwUMrRMlCQ=, tarball: chalk/download/chalk-2.4.2.tgz}
+ resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==, tarball: chalk/download/chalk-2.4.2.tgz}
engines: {node: '>=4'}
dependencies:
ansi-styles: 3.2.1
@@ -1146,6 +1478,12 @@ packages:
readable-stream: 1.0.34
dev: true
+ /convert-source-map/1.8.0:
+ resolution: {integrity: sha1-8zc8MtIbTXgN2ABFFGhPt5HKQ2k=, tarball: convert-source-map/download/convert-source-map-1.8.0.tgz?cache=0&sync_timestamp=1634135144392&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fconvert-source-map%2Fdownload%2Fconvert-source-map-1.8.0.tgz}
+ dependencies:
+ safe-buffer: 5.1.2
+ dev: true
+
/cookie/0.4.1:
resolution: {integrity: sha1-r9cT/ibr0hupXOth+agRblClN9E=, tarball: cookie/download/cookie-0.4.1.tgz}
engines: {node: '>= 0.6'}
@@ -1498,6 +1836,10 @@ packages:
jake: 10.8.2
dev: true
+ /electron-to-chromium/1.4.48:
+ resolution: {integrity: sha512-RT3SEmpv7XUA+tKXrZGudAWLDpa7f8qmhjcLaM6OD/ERxjQ/zAojT8/Vvo0BSzbArkElFZ1WyZ9FuwAYbkdBNA==, tarball: electron-to-chromium/download/electron-to-chromium-1.4.48.tgz}
+ dev: true
+
/element-plus/1.3.0-beta.5_vue@3.2.26:
resolution: {integrity: sha512-su0sHN4ZkR5ISyP1McyiqY5wqrgZgKq0El0lSohjvjEWR3ODlgdmMfQolV0ZqTXKlO2mS16hO7nTFwX9PvZNTQ==, tarball: element-plus/download/element-plus-1.3.0-beta.5.tgz}
peerDependencies:
@@ -1731,6 +2073,11 @@ packages:
esbuild-windows-arm64: 0.13.15
dev: true
+ /escalade/3.1.1:
+ resolution: {integrity: sha1-2M/ccACWXFoBdLSoLqpcBVJ0LkA=, tarball: escalade/download/escalade-3.1.1.tgz}
+ engines: {node: '>=6'}
+ dev: true
+
/escape-html/1.0.3:
resolution: {integrity: sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=, tarball: escape-html/download/escape-html-1.0.3.tgz}
dev: true
@@ -2205,6 +2552,11 @@ packages:
globule: 1.3.3
dev: true
+ /gensync/1.0.0-beta.2:
+ resolution: {integrity: sha1-MqbudsPX9S1GsrGuXZP+qFgKJeA=, tarball: gensync/download/gensync-1.0.0-beta.2.tgz}
+ engines: {node: '>=6.9.0'}
+ dev: true
+
/get-caller-file/2.0.5:
resolution: {integrity: sha1-T5RBKoLbMvNuOwuXQfipf+sDH34=, tarball: get-caller-file/download/get-caller-file-2.0.5.tgz}
engines: {node: 6.* || 8.* || >= 10.*}
@@ -2334,6 +2686,11 @@ packages:
which: 1.3.1
dev: true
+ /globals/11.12.0:
+ resolution: {integrity: sha1-q4eVM4hooLq9hSV1gBjCp+uVxC4=, tarball: globals/download/globals-11.12.0.tgz?cache=0&sync_timestamp=1635391915328&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fglobals%2Fdownload%2Fglobals-11.12.0.tgz}
+ engines: {node: '>=4'}
+ dev: true
+
/globals/13.11.0:
resolution: {integrity: sha1-QO9njaEX/nvS4o8fqySVG9AlW+c=, tarball: globals/download/globals-13.11.0.tgz}
engines: {node: '>=8'}
@@ -2482,6 +2839,10 @@ packages:
dependencies:
function-bind: 1.1.1
+ /hash-sum/2.0.0:
+ resolution: {integrity: sha1-gdAbtd6OpKIUrV1urRtSNGCwtFo=, tarball: hash-sum/download/hash-sum-2.0.0.tgz}
+ dev: true
+
/he/1.2.0:
resolution: {integrity: sha1-hK5l+n6vsWX922FWauFLrwVmTw8=, tarball: he/download/he-1.2.0.tgz}
hasBin: true
@@ -3005,6 +3366,12 @@ packages:
resolution: {integrity: sha1-peZUwuWi3rXyAdls77yoDA7y9RM=, tarball: jsbn/download/jsbn-0.1.1.tgz}
dev: true
+ /jsesc/2.5.2:
+ resolution: {integrity: sha1-gFZNLkg9rPbo7yCWUKZ98/DCg6Q=, tarball: jsesc/download/jsesc-2.5.2.tgz}
+ engines: {node: '>=4'}
+ hasBin: true
+ dev: true
+
/json-content-demux/0.1.4:
resolution: {integrity: sha1-bVc/u1orIkriJXNuKH8y6pGkJz0=, tarball: json-content-demux/download/json-content-demux-0.1.4.tgz}
engines: {node: '>= 0.6.0'}
@@ -3035,7 +3402,15 @@ packages:
dev: true
/json5/1.0.1:
- resolution: {integrity: sha1-d5+wAYYE+oVOrL9iUhgNg1Q+Pb4=, tarball: json5/download/json5-1.0.1.tgz}
+ resolution: {integrity: sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==, tarball: json5/download/json5-1.0.1.tgz}
+ hasBin: true
+ dependencies:
+ minimist: 1.2.5
+ dev: true
+
+ /json5/2.2.0:
+ resolution: {integrity: sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==, tarball: json5/download/json5-2.2.0.tgz}
+ engines: {node: '>=6'}
hasBin: true
dependencies:
minimist: 1.2.5
@@ -3441,15 +3816,15 @@ packages:
dev: false
/ms/2.0.0:
- resolution: {integrity: sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=, tarball: ms/download/ms-2.0.0.tgz}
+ resolution: {integrity: sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=, tarball: ms/download/ms-2.0.0.tgz?cache=0&sync_timestamp=1632883299868&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fms%2Fdownload%2Fms-2.0.0.tgz}
dev: true
/ms/2.1.2:
- resolution: {integrity: sha1-0J0fNXtEP0kzgqjrPM0YOHKuYAk=, tarball: ms/download/ms-2.1.2.tgz}
+ resolution: {integrity: sha1-0J0fNXtEP0kzgqjrPM0YOHKuYAk=, tarball: ms/download/ms-2.1.2.tgz?cache=0&sync_timestamp=1632883299868&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fms%2Fdownload%2Fms-2.1.2.tgz}
dev: true
/ms/2.1.3:
- resolution: {integrity: sha1-V0yBOM4dK1hh8LRFedut1gxmFbI=, tarball: ms/download/ms-2.1.3.tgz}
+ resolution: {integrity: sha1-V0yBOM4dK1hh8LRFedut1gxmFbI=, tarball: ms/download/ms-2.1.3.tgz?cache=0&sync_timestamp=1632883299868&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fms%2Fdownload%2Fms-2.1.3.tgz}
dev: true
/mute-stream/0.0.8:
@@ -3541,6 +3916,10 @@ packages:
upper-case: 2.0.2
dev: true
+ /node-releases/2.0.1:
+ resolution: {integrity: sha1-PR05XyBPHy8ppUNYuftnh2WtL8U=, tarball: node-releases/download/node-releases-2.0.1.tgz}
+ dev: true
+
/normalize-package-data/2.5.0:
resolution: {integrity: sha1-5m2xg4sgDB38IzIl0SyzZSDiNKg=, tarball: normalize-package-data/download/normalize-package-data-2.5.0.tgz}
dependencies:
@@ -3776,7 +4155,7 @@ packages:
resolution: {integrity: sha1-x2/Gbe5UIxyWKyK8yKcs8vmXU80=, tarball: parse-json/download/parse-json-5.2.0.tgz}
engines: {node: '>=8'}
dependencies:
- '@babel/code-frame': 7.16.0
+ '@babel/code-frame': 7.16.7
error-ex: 1.3.2
json-parse-even-better-errors: 2.3.1
lines-and-columns: 1.1.6
@@ -4471,6 +4850,11 @@ packages:
hasBin: true
dev: true
+ /semver/6.3.0:
+ resolution: {integrity: sha1-7gpkyK9ejO6mdoexM3YeG+y9HT0=, tarball: semver/download/semver-6.3.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fsemver%2Fdownload%2Fsemver-6.3.0.tgz}
+ hasBin: true
+ dev: true
+
/semver/7.3.5:
resolution: {integrity: sha1-C2Ich5NI2JmOSw5L6Us/EuYBjvc=, tarball: semver/download/semver-7.3.5.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fsemver%2Fdownload%2Fsemver-7.3.5.tgz}
engines: {node: '>=10'}
@@ -5091,6 +5475,11 @@ packages:
os-tmpdir: 1.0.2
dev: true
+ /to-fast-properties/2.0.0:
+ resolution: {integrity: sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=, tarball: to-fast-properties/download/to-fast-properties-2.0.0.tgz}
+ engines: {node: '>=4'}
+ dev: true
+
/to-object-path/0.3.0:
resolution: {integrity: sha1-KXWIt7Dn4KwI4E5nL4XB9JmeF68=, tarball: to-object-path/download/to-object-path-0.3.0.tgz}
engines: {node: '>=0.10.0'}
diff --git a/src/assets/icons/sidebar-jsx.svg b/src/assets/icons/sidebar-jsx.svg
new file mode 100644
index 0000000..9b6897a
--- /dev/null
+++ b/src/assets/icons/sidebar-jsx.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index dee604c..373867a 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -73,6 +73,7 @@ import ComponentBasicExample from './modules/component.basic.example'
import ComponentExtendExample from './modules/component.extend.example'
import PermissionExample from './modules/permission.example'
import MockExample from './modules/mock.example'
+import JsxExample from './modules/jsx.example'
import ExternalLinkExample from './modules/external.link.example'
// import VideosExample from './modules/videos.example'
import EcologyExample from './modules/ecology.example'
@@ -93,6 +94,7 @@ const asyncRoutes = [
ComponentExtendExample,
PermissionExample,
MockExample,
+ JsxExample,
ExternalLinkExample
]
},
diff --git a/src/router/modules/jsx.example.js b/src/router/modules/jsx.example.js
new file mode 100644
index 0000000..a2edd5e
--- /dev/null
+++ b/src/router/modules/jsx.example.js
@@ -0,0 +1,25 @@
+const Layout = () => import('@/layout/index.vue')
+
+export default {
+ path: '/jsx_example',
+ component: Layout,
+ redirect: '/jsx_example/index',
+ name: 'jsxExample',
+ meta: {
+ title: 'JSX',
+ icon: 'sidebar-jsx'
+ },
+ children: [
+ {
+ path: 'index',
+ name: 'jsxExampleIndex',
+ component: () => import('@/views/jsx_example/index.jsx'),
+ meta: {
+ title: 'JSX',
+ sidebar: false,
+ breadcrumb: false,
+ activeMenu: '/jsx_example'
+ }
+ }
+ ]
+}
diff --git a/src/views/jsx_example/components/JsxComp/index.vue b/src/views/jsx_example/components/JsxComp/index.vue
new file mode 100644
index 0000000..5ea360b
--- /dev/null
+++ b/src/views/jsx_example/components/JsxComp/index.vue
@@ -0,0 +1,20 @@
+
+
+
diff --git a/src/views/jsx_example/index.jsx b/src/views/jsx_example/index.jsx
new file mode 100644
index 0000000..2cf1f45
--- /dev/null
+++ b/src/views/jsx_example/index.jsx
@@ -0,0 +1,47 @@
+import styles from './index.module.scss'
+import JsxComp from './components/JsxComp/index.vue'
+
+export default defineComponent({
+ name: 'JsxExample',
+ render() {
+ const iconsArr = ref([
+ 'sidebar-jsx',
+ 'sidebar-element'
+ ])
+ const icons = (
+ iconsArr.value.map(v => {
+ return
+ })
+ )
+
+ let count = ref(0)
+ function onPlus(v = 1) {
+ count.value += v
+ }
+ const html = '这是一段HTML代码
'
+ const html2 =
+ 这也是一段HTML代码
+
+
+ return
+
+
+ 这是两个 Svg Icon 图标
+ {icons}
+
+
+
+
+ onPlus(10)}>点我：{ count.value }
+
+ {html2}
+
+
+
+