feat: optimize default value

README.md

@@ -17,17 +17,14 @@ npm i --save-dev awesome-skeleton
 ## 使用方法
 
 ```js
-const path = require('path');
 const getSkeleton = require('awesome-skeleton');
 
 getSkeleton({
   pageName: 'baidu',
   pageUrl: 'https://www.baidu.com',
-  outputPath: path.join(__dirname, 'output'),
   device: 'iPhone X',
   minGrayBlockWidth: 80,
   minGrayPseudoWidth: 10,
-  debug: false,
 }).then(skeletonHTML => {
   console.log('skeleton HTML: ', skeletonHTML)
 });
@@ -39,9 +36,9 @@ getSkeleton({
 
 | 参数名称 | 必填 | 默认值 | 说明 |
 | --- | --- | --- | --- |
-| pageName | 是 | - | 页面名称（仅限英文） |
 | pageUrl | 是 | - | 页面地址（此地址必须可访问） |
-| outputPath | 是 | - | 骨架图文件输出文件夹路径 |
+| pageName | 否 | output | 页面名称（仅限英文） |
+| outputPath | 否 | skeleton-output | 骨架图文件输出文件夹路径，默认到项目 skeleton-output 中 |
 | openRepeatList | 否 | true | 默认会将每个列表的第一项进行复制 |
 | device | 否 | 空为PC | 参考 puppeteer/DeviceDescriptors.js，可以设置为 'iPhone 6 Plus' |
 | debug | 否 | false | 是否开启调试开关 |

demo/index.js

@@ -1,10 +1,8 @@
-const path = require('path');
 const getSkeleton = require('../src/index');
 
 getSkeleton({
   pageName: 'baidu',
   pageUrl: 'https://www.baidu.com',
-  outputPath: path.join(__dirname, 'output'),
   openRepeatList: false,
   device: 'iPhone X', // 为空则使用默认 PC 页面打开
   minGrayBlockWidth: 80,
@@ -13,6 +11,6 @@ getSkeleton({
   delayTime: 0,
   debugTime: 1000,
 }).then(result => {
-  console.log(result)
+  console.log(result.html)
 })
 

src/index.js

@@ -1,6 +1,5 @@
-
-
 const fs = require('fs');
+const path = require('path');
 
 const {
   saveScreenShot,
@@ -13,7 +12,7 @@ const insertSkeleton = require('./insertSkeleton');
  * @param {Object} options 配置
  * @param {String} options.pageName 页面名称（仅限英文）
  * @param {String} options.pageUrl 页面地址（此地址必须可访问）
- * @param {String} options.outputPath 骨架图文件输出文件夹路径
+ * @param {String} options.outputPath 骨架图文件输出文件夹路径，不填则输出到默认项目
  * @param {Boolean} options.openRepeatList 默认会将每个列表的第一项进行复制，默认值 true
  * @param {Object} options.device 参考 puppeteer/DeviceDescriptors.js
  * @param {Number} options.minGrayBlockWidth 最小处理灰色块的宽度
@@ -24,13 +23,17 @@ const insertSkeleton = require('./insertSkeleton');
  */
 const getSkeleton = async function(options) {
   // 参数校验
-  if (!options.pageName || !options.pageUrl || !options.outputPath) {
-    console.warning('参数不能为空！');
+  if (!options.pageUrl) {
+    console.warn('页面地址不能为空！');
     return false;
   }
 
+  // 设置默认参数
+  options.pageName = options.pageName ? options.pageName : 'output';
+  options.outputPath = options.outputPath ? options.outputPath : path.join('skeleton-output');
+
   // 若不存在 output 目录，创建目录
-  if (options.outputPath && !fs.existsSync(options.outputPath)) {
+  if (!fs.existsSync(options.outputPath)) {
     fs.mkdirSync(options.outputPath);
   }
 
@@ -46,12 +49,12 @@ const getSkeleton = async function(options) {
   const skeletonImageBase64 = await saveScreenShot(page, options);
 
   // 将骨架图注入要页面
-  const skeletonHTML = insertSkeleton(skeletonImageBase64, options);
+  const result = insertSkeleton(skeletonImageBase64, options);
 
   // 关闭浏览器
   await browser.close();
 
-  return skeletonHTML;
+  return result;
 };
 
 module.exports = getSkeleton;

src/insertSkeleton.js

@@ -7,7 +7,7 @@ const insertSkeleton = (skeletonImageBase64, options) => {
   const skeletonHTMLPath = path.join(options.outputPath, `skeleton-${options.pageName}.html`);
 
   if (!skeletonImageBase64) {
-    console.warning('骨架图还没未生成');
+    console.warn('骨架图还没未生成');
     return false;
   }
 
@@ -82,7 +82,10 @@ const insertSkeleton = (skeletonImageBase64, options) => {
     if (err) return console.error(err);
   });
 
-  return minifyContent;
+  return {
+    html: minifyContent,
+    img: skeletonImageBase64,
+  };
 };
 
 module.exports = insertSkeleton;