chore: docs

afeiship · Sep 10, 2021 · 9401e70 · 9401e70
1 parent 67758cf
commit 9401e70
Show file tree

Hide file tree

Showing 7 changed files with 53 additions and 19 deletions.
diff --git a/README.md b/README.md
@@ -17,35 +17,55 @@ __GENERATE_DOCS__
 ## usage
 1. import css
   ```scss
-  @import "~@jswork/react-ellipsis-middle/dist/style.css";
+  @import "~@jswork/boilerplate-react-component/dist/style.css";
 
   // or use sass
-  @import "~@jswork/react-ellipsis-middle/dist/style.scss";
+  @import "~@jswork/boilerplate-react-component/dist/style.scss";
 
   // customize your styles:
-  $react-ellipsis-middle-options: ()
+  $boilerplate-react-component-options: ()
   ```
 2. import js
   ```js
   import React from 'react';
-  import ReactEllipsisMiddle from '@jswork/react-ellipsis-middle';
+  import ReactEllipsisMiddle from '@jswork/boilerplate-react-component';
   import styled from 'styled-components';
   import '../../src/components/style.scss';
 
   const Container = styled.div`
-    width: 80%;
-    margin: 30px auto 0;
+    width: 600px;
+    margin: 50px auto;
+    border-radius: 8px;
+    padding: 15px;
+    overflow: hidden;
+    resize: horizontal;
+    box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #ffffff;
+
+    .react-ellipsis-middle {
+      cursor: pointer;
+      &:hover {
+        transition: all 0.5s ease;
+        background-color: #f60;
+      }
+    }
   `;
 
   export default (props: any) => {
     return (
       <Container>
         <ReactEllipsisMiddle size="120px">
-          CSS 测试标题，这是一个稍微有点长的标题，超出一行以后才会有title提示，标题是 实现优惠券的技巧 - 2021-03-26
+          CSS 测试标题，这是一个稍微有点长的标题，超出一行以后才会有title提示，标题是 实现优惠券的技巧
+          - 2021-03-26
         </ReactEllipsisMiddle>
 
         <ReactEllipsisMiddle size="50%">
-          CSS 测试标题，这是一个稍微有点长的标题，超出一行以后才会有title提示，标题是 实现优惠券的技巧 - 2021-03-26
+          CSS 测试标题，这是一个稍微有点长的标题，超出一行以后才会有title提示，标题是 实现优惠券的技巧
+          - 2021-03-26
+        </ReactEllipsisMiddle>
+
+        <ReactEllipsisMiddle>CSS 实现优惠券的技巧 - 2021-03-26</ReactEllipsisMiddle>
+        <ReactEllipsisMiddle minSize="40px">
+          我是一个很长的文件，我是一个很长的文件，但请始终保持我的后缀名.pdf
         </ReactEllipsisMiddle>
       </Container>
     );

diff --git a/build/markdown.js b/build/markdown.js
@@ -1,8 +1,7 @@
-const fs = require('fs');
-const indentString = require('indent-string');
+import fs from 'fs';
+import indentString from 'indent-string';
 
-require('@jswork/next');
-require('@jswork/next-replace-in-file');
+import '@jswork/next-replace-in-file';
 
 nx.declare({
   statics: {
@@ -21,7 +20,7 @@ nx.declare({
 
       nx.replaceInFile('README.md', [
         // ['__GENERATE_DOCS__', rmp('./src/components/index.tsx')],
-        ['__GENERATE_DAPP__', indentString(docApp, ' ', 2)],
+        ['__GENERATE_DAPP__', indentString(docApp, 2)],
         ['../../src/main', '@jswork/boilerplate-react-component']
       ]);
     }

diff --git a/docs/assets/index.57b24b72.js b/docs/assets/index.57b24b72.js
diff --git a/docs/assets/index.84fed453.js b/docs/assets/index.84fed453.js
diff --git a/docs/assets/vendor.4a90092b.js → docs/assets/vendor.76891dd0.js b/docs/assets/vendor.4a90092b.js → docs/assets/vendor.76891dd0.js
diff --git a/docs/index.html b/docs/index.html
@@ -4,8 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Vite App</title>
-    <script type="module" crossorigin src="assets/index.57b24b72.js"></script>
-    <link rel="modulepreload" href="assets/vendor.4a90092b.js">
+    <script type="module" crossorigin src="assets/index.84fed453.js"></script>
+    <link rel="modulepreload" href="assets/vendor.76891dd0.js">
     <link rel="stylesheet" href="assets/index.c9b5aeb1.css">
   </head>
   <body>

diff --git a/package.json b/package.json
@@ -5,6 +5,7 @@
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/main.d.ts",
+  "type": "module",
   "files": [
     "dist"
   ],
@@ -40,6 +41,7 @@
     "babel-loader": "^8.2.2",
     "core-js": "^3.8.2",
     "css-loader": "^5.0.1",
+    "indent-string": "^5.0.0",
     "jest": "^26.6.3",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",