| 1 | <h1 style="font-weight: normal"> 将FEkit项目迁移到YKit </h1>
|
| 2 |
|
| 3 | <h2 style="font-weight: normal"> 下载依赖 </h2>
|
| 4 |
|
| 5 | 迁移所需要的依赖是`@qnpm/ykit-config-fekit`包：
|
| 6 |
|
| 7 | ```
|
| 8 | qnpm i @qnpm/ykit-config-fekit --save
|
| 9 | ```
|
| 10 |
|
| 11 | 然后包的postinstall脚本会帮你创建`ykit.fekit.js`到项目根目录下。
|
| 12 |
|
| 13 | 和其他ykit项目不同的是你不需要写任何配置项，里面可配置的只有sync到开发机的命令。所有的相关配置都会从fekit.config中读取。
|
| 14 |
|
| 15 | <h2 style="font-weight: normal"> 尝试迁移 </h2>
|
| 16 |
|
| 17 | ** 以下内容非常重要，请仔细阅读后再进行操作 **
|
| 18 |
|
| 19 | <h3 style="font-weight: normal"> 目前不支持的项目类型： </h3>
|
| 20 |
|
| 21 | - 使用了`scripts`(premin,prepack,postmin,postpack,prepublish)钩子脚本的项目
|
| 22 | - 使用.less文件的项目
|
| 23 | - 使用了.mustache/.handlebar/.hogan文件的项目
|
| 24 | - 各种利用了非常规fekit bug的项目（例如使用注释来require依赖）
|
| 25 |
|
| 26 | 以上几类项目目前完全无法迁移，会逐次提供支持，请等待之后版本的ykit-config-fekit。
|
| 27 |
|
| 28 | 另外，如果是先使用webpack构建再用FEkit发布的项目，也可以迁移，但是需要手动执行webpack构建过程先生成pack后的文件。
|
| 29 |
|
| 30 | <h3 style="font-weight: normal"> 迁移步骤 </h3>
|
| 31 |
|
| 32 | <h4 style="font-weight: normal"> 1. 本地pack </h4>
|
| 33 |
|
| 34 | 首先请在项目根目录下调用`ykit pack -c`生成dev文件。然后注意看一下命令行可能出现的报错，例如：
|
| 35 |
|
| 36 | ```
|
| 37 | X ./~/css-loader?-url!./~/@qnpm/ykit-config-fekit/loaders/fekit-scss.js!./src/styles/expcleisure-index.css
|
| 38 | Module build failed: Missed semicolon (87:127)
|
| 39 |
|
| 40 | 85 | .b_event_description{ padding-bottom:10px; }
|
| 41 | 86 | .b_event_description .e_process{ padding:15px 0 8px 85px; text-align:center; }
|
| 42 | > 87 | .b_event_description .e_process li{ margin-left:12px; padding-right:36px; width:158px; display:inline; float:left; background:background:url(http://source.qunar.com/site/images/zhuanti/130424-1/icon.png) no-repeat 100% 44px; }
|
| 43 | | ^
|
| 44 | 88 | .b_event_description .e_process li.last{ background:none; }
|
| 45 | 89 | .b_event_description .e_process .step_01, .b_event_description .e_process .step_02, .b_event_description .e_process .step_03, .b_event_description .e_process .step_04{ width:158px; height:114px; background:url(http://source.qunar.com/site/images/zhuanti/130424-1/step.png) no-repeat 0 0; overflow:hidden; }
|
| 46 | 90 | .b_event_description .e_process .step_02{ background-position:0 -125px; }
|
| 47 | ```
|
| 48 |
|
| 49 | 由于FEkit不会校验css的语法，因此我们发现大部分的项目都存在类似的各种css错误，这在ykit不再被允许，你需要手动修改这些错误以后再尝试迁移。
|
| 50 |
|
| 51 | 以上错误只是各种css语法错误中的一种，请仔细阅读错误信息。
|
| 52 |
|
| 53 | 另外，在js中也可能出现语法错误，例如：
|
| 54 |
|
| 55 | ```
|
| 56 | X ./src/scripts/a/touch/recruitSleeper/index.js
|
| 57 | Module not found: Error: Cannot resolve module 'prepareSleeper/index/js' in /Users/chenjiao/Documents/qzz/ugc/src/scripts/a/touch/recruitSleeper
|
| 58 | @ ./src/scripts/a/touch/recruitSleeper/index.js 5:0-34
|
| 59 | ```
|
| 60 |
|
| 61 | 这个错误对应的源码长这个样子：
|
| 62 |
|
| 63 | ```
|
| 64 | require("prepareSleeper/index/js");
|
| 65 | ```
|
| 66 |
|
| 67 | 这种错误在fekit中也被默默地无视掉了，请参照报错信息进行修改。
|
| 68 |
|
| 69 | 请重复以上两个步骤，直到没有报错为止。
|
| 70 |
|
| 71 | <h4 style="font-weight: normal"> 2. dev测试 </h4>
|
| 72 |
|
| 73 | 调用``ykit sync``可以将项目sync到开发机，然后请修改host进行dev测试（这个就不多说怎么弄了）。
|
| 74 |
|
| 75 | 最好每个页面都看一下是否有问题。
|
| 76 |
|
| 77 | <h4 style="font-weight: normal"> beta/正式发布 </h4>
|
| 78 |
|
| 79 | 按流程走即可。
|
| 80 |
|
| 81 | <h2 style="font-weight: normal"> 支持 </h2>
|
| 82 |
|
| 83 | 请qtalk jiao.shen或者yuhao.ju
|
| 84 |
|
| 85 | <h2 style="font-weight: normal"> 已经转化成功的项目列表 </h2>
|
| 86 |
|
| 87 | 注意，以下的项目绝大多数都有上面提到的css语法问题和js引用问题，都是手动修复以后转化成功的：
|
| 88 |
|
| 89 | - ugc_mall
|
| 90 | - ugc
|
| 91 | - ugchybrid
|
| 92 | - ugc_mall_admin
|
| 93 | - ugc_review_audit
|
| 94 | - ugc_topic
|
| 95 | - trainticket
|
| 96 | - hotel_fekit
|
| 97 | - bnb_fekit
|
| 98 | - bnbhybrid
|
| 99 | - hotel_luxury
|
| 100 | - mice_search_fekit
|
| 101 | - mice_operation_fekit
|