)/, "$1" + scpt);
29 | break;
30 | case 'headEnd':
31 | html = html.replace(/(\<\/head\>)/, scpt + "$1");
32 | break;
33 | }
34 | });
35 |
36 | return html;
37 | }
--------------------------------------------------------------------------------
/lib/server/middlewareLocal.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 | /**
3 | * 基于硬盘文件的服务中间件
4 | * 和VFS系统完全不相关
5 | * 在任意目录运行jdf server就是调用的这个middleware
6 | */
7 |
8 | const url = require('url');
9 | const fs = require('fs');
10 | const path = require('path');
11 | const f = require('jdf-utils').file;
12 | const logger = require('jdf-log');
13 |
14 | const mime = require('./mime');
15 | const Compress = require('../urlReplace');
16 | const dirHTML = require('./middlewareVFS/res.dirView/dir.html');
17 |
18 | let server = module.exports = {};
19 |
20 | let config = server.config = {};
21 |
22 | // enum
23 | let pathType = {
24 | combo: 1,
25 | dir: 2,
26 | file: 3,
27 | empty: 4
28 | };
29 |
30 | server.init = function (serverDir, port) {
31 | port = port || 8080;
32 | config.port = port;
33 |
34 | config.serverDir = serverDir;
35 |
36 | return function (request, response, next) {
37 | let jdfRes = {};
38 | let requestUrl = decodeURI(request.url);
39 |
40 | let resource = server.getResourceInfo(requestUrl);
41 | switch (resource.type) {
42 | case pathType.empty: jdfRes = server.Res404(); break;
43 | case pathType.combo: jdfRes = server.ResCombo(resource.filelist); break;
44 | case pathType.dir: jdfRes = server.ResDir(resource.filelist[0], url.parse(requestUrl).pathname); break;
45 | case pathType.file: jdfRes = server.ResFile(resource.filelist[0]); break;
46 | default: jdfRes = server.Res404();
47 | }
48 |
49 | response.writeHead(jdfRes.status, {
50 | 'Content-Type': jdfRes.contentType
51 | });
52 | response.write(jdfRes.content);
53 | response.end();
54 | next();
55 | }
56 | }
57 |
58 | /**
59 | * 根据请求url获取本地文件，目录路径
60 | * @param {String} requestUrl 请求url
61 | * @return {Object} 包含路径信息以及有关这个路径信息的元信息
62 | */
63 | server.getResourceInfo = function (requestUrl) {
64 | requestUrl = requestUrl || '';
65 | // example /a/b/c/
66 | let parsedUrl = url.parse(requestUrl);
67 | let pathname = parsedUrl.pathname;
68 | let isComboUrl = /^\?\?/.test(parsedUrl.search);
69 | let fileNameList = [];
70 | let resource = {};
71 |
72 | if (isComboUrl) {
73 | // ['a.js', 'b.js']
74 | fileNameList = parsedUrl.query.slice(1).split(',');
75 | } else {
76 | // ['/a/b/c/']
77 | fileNameList = [pathname];
78 | }
79 |
80 | fileNameList = fileNameList.map(function (item) {
81 | // ['C://Users/xxx/AppData/Local/Temp/a.js']
82 | return path.normalize(config.serverDir + '/' + decodeURI(item));
83 | });
84 |
85 | // type: combo
86 | if (isComboUrl) {
87 | resource.type = pathType.combo;
88 | resource.filelist = fileNameList;
89 | return resource;
90 | }
91 |
92 | let filepath = fileNameList[0];
93 | let stat;
94 | try {
95 | stat = fs.statSync(filepath);
96 | } catch (e) {
97 | resource.type = pathType.empty;
98 | resource.filelist = [];
99 | return resource;
100 | }
101 | // type: 目录
102 | if (stat.isDirectory()) {
103 | resource.type = pathType.dir;
104 | resource.filelist = fileNameList;
105 | return resource;
106 | }
107 |
108 | // type: 文件
109 | if (stat.isFile()) {
110 | resource.type = pathType.file;
111 | resource.filelist = fileNameList;
112 | return resource;
113 | }
114 |
115 | resource.type = pathType.empty;
116 | resource.filelist = [];
117 | return resource;
118 | }
119 |
120 | /**
121 | * 未找到资源返回404
122 | * @return {Object} 包含状态吗，返回内容类型，返回内容的对象
123 | */
124 | function response404() {
125 | let notfound = '404 Not Found
'+server.copyright(config.port)+'';
126 | return {
127 | status: 404,
128 | contentType: mime['html'],
129 | content: notfound
130 | };
131 | }
132 |
133 | /**
134 | * 404处理函数
135 | * @type {[void]}
136 | */
137 | server.Res404 = response404;
138 |
139 | /**
140 | * 文件资源处理函数
141 | * @param {String} resPath 文件资源路径
142 | * @return {Object} 包含状态吗，返回内容类型，返回内容的对象
143 | */
144 | server.ResFile = function (resPath) {
145 | let ext = path.extname(resPath);
146 | ext = ext.replace('.', '');
147 | let contentType = mime[ext] || mime['txt'];
148 | let content = fs.readFileSync(resPath);
149 | return {
150 | status: 200,
151 | contentType: contentType,
152 | content: content
153 | };
154 | }
155 |
156 | /**
157 | * 目录访问处理函数
158 | * @param {String} resPath 目录路径
159 | * @param {String} urlPath url相对根域名的路径
160 | */
161 | server.ResDir = function (resPath, urlPath) {
162 | let html = server.getDirList(resPath, urlPath);
163 | return {
164 | status: 200,
165 | contentType: mime['html'],
166 | content: html
167 | };
168 | }
169 |
170 | /**
171 | * combo组装处理函数
172 | * @param {Array} resList 需要combo的文件列表
173 | * 备注2016-11-23：有require时解析依赖没有测试，这个测试应该放在compress.js中，正常文件combo是可以成功的
174 | */
175 | server.ResCombo = function (resList) {
176 | let ext, type, content, res;
177 |
178 | if (resList && resList.length > 0) {
179 | ext = path.extname(resList[0]).slice(1);
180 | }
181 | type = mime[ext] || mime['txt'];
182 |
183 | content = server.getComboFilesContent(resList);
184 |
185 | if (content === undefined) {
186 | res = response404();
187 | } else {
188 | res = {
189 | status: 200,
190 | contentType: type,
191 | content: content
192 | }
193 | }
194 | return res;
195 | }
196 |
197 | server.getIp = function(){
198 | let net = require('os').networkInterfaces();
199 | for(let key in net){
200 | if(net.hasOwnProperty(key)){
201 | let items = net[key];
202 | if(items && items.length){
203 | for(let i = 0; i < items.length; i++){
204 | let ip = String(items[i].address).trim();
205 | if(ip && /^\d+(?:\.\d+){3}$/.test(ip) && ip !== '127.0.0.1'){
206 | return ip;
207 | }
208 | }
209 | }
210 | }
211 | }
212 | return '127.0.0.1';
213 | };
214 |
215 | server.copyright = function (port){
216 | let serverIp = server.getIp()+':'+port;
217 | let copyright = 'jdf server '+
218 | ' IP '+serverIp+' '+
219 | //''+new Date()+' '+
220 | '
';
221 | return copyright;
222 | }
223 |
224 | /**
225 | * 拼接展示目录的页面
226 | * @param {String} realPath 目录路径
227 | * @param {String} pathname 相对于根域名的路径
228 | * @return {HTML String} 拼接的html片段
229 | */
230 | server.getDirList = function(realPath){
231 | let data = {
232 | title: '',
233 | projectName: '',
234 | pathname: '',
235 | files: [],
236 | dirs: []
237 | };
238 |
239 | realPath = path.normalize(realPath);
240 | let serverDir = config.serverDir;
241 | let pathname = path.relative(serverDir, realPath);
242 |
243 | data.projectName = path.basename(serverDir);
244 | data.title = data.projectName + ' File List';
245 | data.pathname = pathname;
246 | data.pathname = data.pathname.replace(new RegExp(`\\${path.sep}`, 'g'), '/');
247 |
248 | // 返回上一级目录
249 | data.dirs.push({pathname: path.dirname(data.pathname), name: '..'});
250 |
251 | let projAbsDir = realPath;
252 | // 不过滤任何内容
253 | fs.readdirSync(projAbsDir).forEach(name => {
254 | let absPath = path.join(projAbsDir, name);
255 | let pathname = path.relative(serverDir, absPath);
256 |
257 | // D:\\NodeApp\\jdfDev\\widget\\ -> (localhost:8080)/jdfDev/widget，用于浏览器地址栏，手动统一转为正斜杠
258 | pathname = pathname.replace(new RegExp(`\\${path.sep}`, 'g'), '/');
259 | logger.verbose(`file or dir relative path: ${pathname}`);
260 |
261 | if (f.isDir(absPath)) {
262 | data.dirs.push({pathname: pathname, name: name});
263 | } else if (f.isFile(absPath)) {
264 | data.files.push({pathname: pathname, name: name});
265 | }
266 | });
267 |
268 | let html = dirHTML.html(data);
269 | return html;
270 | }
271 |
272 | /**
273 | * 拼接combo文件
274 | * @param {Array} combolist 需要combo的路径列表
275 | * @return {String} combo后的文件内容
276 | */
277 | server.getComboFilesContent = function (combolist) {
278 | let comboContent = '';
279 | combolist.forEach(function(file){
280 | let content = '';
281 | if(f.exists(file)){
282 | content = f.read(file);
283 | if (path.extname(file) === '.js') {
284 | // 解析js依赖，没有解析css依赖
285 | content = f.read(file);
286 | if(typeof(Compress.addJsDepends) === 'function'){
287 | content = Compress.addJsDepends(file);
288 | }
289 | //如果代码的末尾没有分号，则自动添加一个。以避免代码合并出现异常。
290 | if(!/[;\r\n]$/.test(content)){
291 | content += ';';
292 | }
293 | }
294 | comboContent += content;
295 | }else{
296 | comboContent = undefined;
297 | return false;
298 | }
299 | });
300 | return comboContent;;
301 | }
302 |
--------------------------------------------------------------------------------
/lib/server/middlewareVFS/envConfig.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | module.exports = {
4 | webRoot: ''
5 | }
6 |
--------------------------------------------------------------------------------
/lib/server/middlewareVFS/index.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | let mw = require('./middlewareVFS');
4 |
5 | module.exports.init = mw.init;
6 |
--------------------------------------------------------------------------------
/lib/server/middlewareVFS/middlewareVFS.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 | /**
3 | * 基于VFS系统的服务中间件
4 | * request会首先经过。。。。；。。。
5 | * @type {[type]}
6 | */
7 | const url = require('url');
8 | const fs = require('fs');
9 | const path = require('path');
10 | const f = require('jdf-utils').file;
11 | const mime = require('../mime');
12 | const view = require('./view');
13 | const VFS = require('../../VFS/VirtualFileSystem');
14 | const logger = require('jdf-log');
15 |
16 | let server = module.exports = {};
17 |
18 | // enum
19 | let pathType = {
20 | combo: 1,
21 | dir: 2,
22 | file: 3,
23 | empty: 4
24 | };
25 |
26 | server.init = function (projectDir) {
27 | view.config.webRoot = path.normalize(projectDir);
28 |
29 | return function (request, response, next) {
30 | let jdfRes = {};
31 | let requestUrl = decodeURI(request.url);
32 |
33 | let resource = server.getResourceInfo(requestUrl);
34 | logger.verbose(`resource info: ${JSON.stringify(resource)}`);
35 |
36 | switch (resource.type) {
37 | case pathType.empty: jdfRes = server.Res404(); break;
38 | case pathType.combo: jdfRes = server.ResCombo(resource.filelist); break;
39 | case pathType.dir: jdfRes = server.ResDir(resource.filelist[0]); break;
40 | case pathType.file: jdfRes = server.ResFile(resource.filelist[0]); break;
41 | default: jdfRes = server.Res404();
42 | }
43 |
44 | response.writeHead(jdfRes.status, {
45 | 'Content-Type': jdfRes.contentType
46 | });
47 | response.write(jdfRes.content);
48 | response.end();
49 | next();
50 | }
51 | }
52 |
53 | /**
54 | * 根据请求url获取本地文件，目录路径
55 | * @param {String} requestUrl 请求url
56 | * @return {Object} 包含路径信息以及有关这个路径信息的元信息
57 | */
58 | server.getResourceInfo = function (requestUrl) {
59 | requestUrl = requestUrl || '';
60 | // example /a/b/c/
61 | let parsedUrl = url.parse(requestUrl);
62 | let pathname = parsedUrl.pathname;
63 | let isComboUrl = /^\?\?/.test(parsedUrl.search);
64 | let fileNameList = [];
65 | let resource = {};
66 |
67 | if (isComboUrl) {
68 | // ['a.js', 'b.js']
69 | fileNameList = parsedUrl.query.slice(1).split(',');
70 |
71 | fileNameList = fileNameList.map(function (item) {
72 | // ['C://Users/xxx/AppData/Local/Temp/a.js']
73 | return path.join(view.config.webRoot, pathname, decodeURI(item));
74 | });
75 | } else {
76 | // ['/a/b/c/']
77 | fileNameList = [pathname];
78 | fileNameList = fileNameList.map(function (item) {
79 | // ['C://Users/xxx/AppData/Local/Temp/a.js']
80 | return path.join(view.config.webRoot, decodeURI(item));
81 | });
82 | }
83 |
84 | // type: combo
85 | if (isComboUrl) {
86 |
87 | resource.type = pathType.combo;
88 | } else if (f.isDir(fileNameList[0])) {
89 | // type: 目录
90 | resource.type = pathType.dir;
91 | } else {
92 | // defaults: file
93 | resource.type = pathType.file;
94 | }
95 |
96 | resource.filelist = fileNameList;
97 | return resource;
98 | }
99 |
100 | /**
101 | * 未找到资源返回404
102 | * @return {Object} 包含状态吗，返回内容类型，返回内容的对象
103 | */
104 | function response404() {
105 | let notfound = view.res404();
106 | return {
107 | status: 404,
108 | contentType: mime['html'],
109 | content: notfound
110 | };
111 | }
112 |
113 | /**
114 | * 404处理函数
115 | * @type {[void]}
116 | */
117 | server.Res404 = response404;
118 |
119 | /**
120 | * 文件资源处理函数
121 | * @param {String} resPath 文件资源路径
122 | * @return {Object} 包含状态吗，返回内容类型，返回内容的对象
123 | */
124 | server.ResFile = function (resPath) {
125 | let ext = path.extname(resPath);
126 | ext = ext.replace('.', '');
127 | let contentType = mime[ext] || mime['txt'];
128 |
129 | let content = view.fileRes.getFileContent(resPath);
130 |
131 | // 定义null为not found
132 | if (content === null) {
133 | return this.Res404();
134 | }
135 |
136 | return {
137 | status: 200,
138 | contentType: contentType,
139 | content: content
140 | };
141 | }
142 |
143 | /**
144 | * 目录访问处理函数
145 | * @param {String} resPath 目录路径
146 | * @param {String} urlPath url相对根域名的路径
147 | */
148 | server.ResDir = function (resPath) {
149 | let html = view.dirView.genHTML(resPath);
150 | return {
151 | status: 200,
152 | contentType: mime['html'],
153 | content: html
154 | };
155 | }
156 |
157 | /**
158 | * combo组装处理函数
159 | * @param {Array} resList 需要combo的文件列表
160 | * 备注2016-11-23：有require时解析依赖没有测试，这个测试应该放在compress.js中，正常文件combo是可以成功的
161 | */
162 | server.ResCombo = function (resList) {
163 | let ext, type, content, res;
164 |
165 | if (resList && resList.length > 0) {
166 | ext = path.extname(resList[0]).slice(1);
167 | }
168 | type = mime[ext] || mime['txt'];
169 |
170 | content = view.comboRes.getComboContent(resList);
171 |
172 | if (content === undefined) {
173 | res = response404();
174 | } else {
175 | res = {
176 | status: 200,
177 | contentType: type,
178 | content: content
179 | }
180 | }
181 | return res;
182 | }
183 |
--------------------------------------------------------------------------------
/lib/server/middlewareVFS/res.404.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const res404 = module.exports = {};
4 |
5 | res404.res404 = function () {
6 | return `
7 |
8 |
9 |
10 |
11 |
12 |
13 | 访问的资源不存在
14 |
15 |
16 |
17 | 404 Not Found
18 |
19 | 返回主页
20 |
21 | `;
22 | }
23 |
--------------------------------------------------------------------------------
/lib/server/middlewareVFS/res.comboContent.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const fs = require('fs');
4 | const path = require('path');
5 | const f = require('jdf-utils').file;
6 | const VFS = require('../../VFS/VirtualFileSystem');
7 | const resFile = require('./res.file');
8 |
9 | const combo = module.exports = {};
10 |
11 | /**
12 | * 拼接combo文件
13 | * @param {Array} combolist 需要combo的路径列表
14 | * @return {String} combo后的文件内容
15 | */
16 | combo.getComboContent = function (combolist) {
17 | let comboContent = '';
18 | let allExist = true;
19 | combolist.forEach(filepath => {
20 | filepath = path.normalize(filepath);
21 | let vfile = resFile.getTargetVFile(filepath);
22 | if (!allExist || !vfile) {
23 | allExist = false;
24 | return;
25 | }
26 |
27 | comboContent += vfile.targetContent;
28 |
29 | if (path.extname(filepath) === '.js') {
30 | // 添加分号 以避免代码合并出现异常。
31 | comboContent += ';';
32 | }
33 | });
34 |
35 | if (allExist) {
36 | return comboContent;
37 | } else {
38 | return undefined;
39 | }
40 | }
41 |
--------------------------------------------------------------------------------
/lib/server/middlewareVFS/res.dirView/dir.css.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | let iconfont = `
4 | @font-face {font-family: "iconfont";
5 | src: url('https://raw.githubusercontent.com/jdf2e/jdf/master/lib/server/middlewareVFS/res.dirView/iconfont.eot?t=1481534148992'); /* IE9*/
6 | src: url('https://raw.githubusercontent.com/jdf2e/jdf/master/lib/server/middlewareVFS/res.dirView/iconfont.eot?t=1481534148992#iefix') format('embedded-opentype'), /* IE6-IE8 */
7 | url('https://raw.githubusercontent.com/jdf2e/jdf/master/lib/server/middlewareVFS/res.dirView/iconfont.woff?t=1481534148992') format('woff'), /* chrome, firefox */
8 | url('https://raw.githubusercontent.com/jdf2e/jdf/master/lib/server/middlewareVFS/res.dirView/iconfont.ttf?t=1481534148992') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
9 | url('https://raw.githubusercontent.com/jdf2e/jdf/master/lib/server/middlewareVFS/res.dirView/iconfont.svg?t=1481534148992#iconfont') format('svg'); /* iOS 4.1- */
10 | }
11 | .iconfont {
12 | font-family:"iconfont" !important;
13 | font-size:16px;
14 | font-style:normal;
15 | -webkit-font-smoothing: antialiased;
16 | -webkit-text-stroke-width: 0.2px;
17 | -moz-osx-font-smoothing: grayscale;
18 | }
19 | .icon-file:before { content: "\e66f"; }
20 | .icon-wenjianjia:before { content: "\e7a0"; }`;
21 |
22 | let base = `
23 | html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, address, big, cite, code, del, em, font, img, ins, small, strong, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
24 | margin: 0;
25 | padding: 0;
26 | }
27 |
28 | body {
29 | font-family: Consolas,Microsoft YaHei,Arial,sans-serif;
30 | font-size: 16px;
31 | line-height: 1.42857143;
32 | color: #333;
33 | background-color: #fff;
34 | padding-top: 72px;
35 | background: #fff;
36 | }
37 |
38 | ol, ul {
39 | list-style: none;
40 | }
41 |
42 | a {
43 | color: #666;
44 | text-decoration: none;
45 | }`;
46 |
47 | let header = `
48 | .header-wrap {
49 | background: #eee;
50 | position: fixed;
51 | left: 0;
52 | top: 0;
53 | width: 100%;
54 | z-index: 999;
55 | }
56 |
57 | .page-header {
58 | margin: 0 auto;
59 | width: 100%;
60 | max-width: 900px;
61 | padding-left: 15px;
62 | padding-top: 8px;
63 | box-sizing: border-box;
64 | }
65 |
66 | .page-header .header-text {
67 | line-height: 40px;
68 | font-size: 18px;
69 | }`;
70 |
71 | let content = `
72 | .page-content {
73 | margin: 0 auto;
74 | width: 100%;
75 | max-width: 900px;
76 | }
77 |
78 | .dir-list-header {
79 | padding: 10px 15px;
80 | font-weight: bold;
81 | font-size: 14px;
82 | }
83 |
84 | .dir-list {
85 | padding-bottom: 100px;
86 | }
87 |
88 | .dir-list li {
89 | display: block;
90 | box-sizing: border-box;
91 | }
92 |
93 | .dir-list li a {
94 | position: relative;
95 | display: block;
96 | padding: 10px 15px;
97 | border-bottom: 1px solid #eee;
98 | text-decoration: none;
99 | }
100 |
101 | .dir-list li a:hover {
102 | background-color: #eee;
103 | text-decoration: none;
104 | color: #333;
105 | }
106 |
107 | .dir-list li .icon {
108 | display: inline-block;
109 | margin-right: 5px;
110 | }
111 |
112 | .dir-list li .icon.i-dir {
113 | color: #ff6309;
114 | }`;
115 |
116 | let footer = `
117 | .footer {
118 | position: fixed;
119 | bottom: 0px;
120 | width: 100%;
121 | text-align: center;
122 | background: #eee;
123 | }`;
124 |
125 | let qrcode = `
126 | .qrcode-expand {
127 | position: fixed;
128 | right: 2%;
129 | top: 48px;
130 | width: 144px;
131 | background: #fff;
132 | z-index: 9;
133 | }
134 |
135 | .qrcode-expand .deco-left, .qrcode-expand .deco-right, .qrcode-expand .qrcode-btn {
136 | float: right;
137 | height: 24px;
138 | line-height: 24px;
139 | background: #7a6e6e;
140 | cursor: pointer;
141 | }
142 |
143 | .qrcode-expand .up-btn {
144 | width: 100%;
145 | height: 24px;
146 | padding: 0;
147 | line-height: 24px;
148 | border: 0 none;
149 | background: #7a6e6e;
150 | font-size: 14px;
151 | color: #ffe;
152 | border-radius: 4px;
153 | cursor: pointer;
154 | }
155 |
156 | .qrcode-expand .deco-right, .qrcode-expand .deco-left {
157 | width: 24px;
158 | background: #7a6e6e;
159 | }
160 |
161 | .qrcode-expand .deco-right div, .qrcode-expand .deco-left div {
162 | width: 24px;
163 | height: 24px;
164 | background: #fff;
165 | }
166 |
167 | .qrcode-expand .deco-right div {
168 | border-top-right-radius: 11px;
169 | }
170 |
171 | .qrcode-expand .deco-left div {
172 | border-top-left-radius: 11px;
173 | }
174 |
175 | .qrcode-expand .qrcode-btn {
176 | width: 80px;
177 | background: #7a6e6e;
178 | text-align: center;
179 | color: #ffe;
180 | border-radius: 0 0 15px 15px;
181 | -webkit-user-select: none;
182 | -moz-user-select: none;
183 | -ms-user-select: none;
184 | user-select: none;
185 | }
186 |
187 | .qrcode-expand .qrcode-wrap {
188 | display: none;
189 | float: left;
190 | width: 144px;
191 | padding-top: 5px;
192 | }
193 |
194 | .qrcode-expand .tips {
195 | font-size: 12px;
196 | color: red;
197 | }`;
198 |
199 | module.exports = `
200 | ${iconfont}
201 | ${base}
202 | ${header}
203 | ${content}
204 | ${qrcode}
205 | ${footer}
206 | `;
207 |
--------------------------------------------------------------------------------
/lib/server/middlewareVFS/res.dirView/dir.html.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 | const css = require('./dir.css');
3 |
4 | module.exports = {};
5 |
6 | let dirHTML = module.exports = {};
7 |
8 | dirHTML.DataExample = {
9 | title: 'directory',
10 | projectName: 'projectName',
11 | pathname: '',
12 | files: [{pathname: '', name: ''}],
13 | dirs: [{pathname: '', name: ''}]
14 | }
15 |
16 | dirHTML.html = function (data) {
17 | return `
18 |
19 |
20 |
21 |
22 |
23 |
24 | ${data.title}
25 |
26 |
27 |
28 |
31 |
32 |
33 |
38 |
39 |
44 |
45 |
46 | ${dirHTML.genDirList(data.dirs)}
47 | ${dirHTML.genFileList(data.files)}
48 |
49 |
50 |
60 |
二维码
61 |
62 |
手机访问本页面
63 |
64 |
65 |
顺利访问tips:
66 |
# 当前url不是localhost或127.0.0.1
67 |
# 手机电脑在同一网络
68 |
# 选择Access URLs: External网址
69 |
# build -o,自动打开的网址就是External网址
70 |
# weinre调试:3001/remote-debug
71 |
72 |
73 |
74 |
work well!`;
7 | return tpl;
8 | }
9 |
--------------------------------------------------------------------------------
/lib/server/middlewareVFS/view.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const envConfig = require('./envConfig');
4 | const dirView = require('./res.dirView');
5 | const comboRes = require('./res.comboContent.js');
6 | const notfound = require('./res.404.js');
7 | const fileRes = require('./res.file.js');
8 |
9 | const view = module.exports = {};
10 | view.config = envConfig;
11 |
12 | view.dirView = dirView;
13 | view.comboRes = comboRes;
14 | view.res404 = notfound.res404;
15 | view.fileRes = fileRes;
16 |
--------------------------------------------------------------------------------
/lib/server/mime.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | "css": "text/css",
3 | "gif": "image/gif",
4 | "html": "text/html",
5 | "tpl": "text/html",
6 | "vm": "text/html",
7 | "shtml": "text/html",
8 | "ico": "image/x-icon",
9 | "jpeg": "image/jpeg",
10 | "jpg": "image/jpeg",
11 | "js": "application/javascript",
12 | "json": "application/json",
13 | "pdf": "application/pdf",
14 | "png": "image/png",
15 | "svg": "image/svg+xml",
16 | "swf": "application/x-shockwave-flash",
17 | "tiff": "image/tiff",
18 | "txt": "text/plain",
19 | "wav": "audio/x-wav",
20 | "wma": "audio/x-ms-wma",
21 | "wmv": "video/x-ms-wmv",
22 | "xml": "text/xml",
23 | "ttf":"font/ttf",
24 | "otf":"font/opentype",
25 | "woff":"application/font-woff",
26 | "woff2":"application/font-woff2",
27 | "eot":"application/vnd.ms-fontobject"
28 | };
--------------------------------------------------------------------------------
/lib/server/openurl.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | /**
4 | * @openurl
5 | * @from https://github.com/rauschma/openurl/blob/master/openurl.js
6 | * @example require("./openurl").open(url);
7 | */
8 | const spawn = require('child_process').spawn;
9 | let command;
10 |
11 | switch(process.platform) {
12 | case 'darwin':
13 | command = 'open';
14 | break;
15 | case 'win32':
16 | command = 'explorer.exe';
17 | break;
18 | case 'linux':
19 | command = 'xdg-open';
20 | break;
21 | default:
22 | throw new Error('Unsupported platform: ' + process.platform);
23 | }
24 |
25 | /**
26 | * Error handling is deliberately minimal, as this function is to be easy to use for shell scripting
27 | *
28 | * @param url The URL to open
29 | * @param callback A function with a single error argument. Optional.
30 | */
31 |
32 | function open(url, callback) {
33 | const child = spawn(command, [url]);
34 | let errorText = '';
35 | child.stderr.setEncoding('utf8');
36 | child.stderr.on('data', function (data) {
37 | errorText += data;
38 | });
39 | child.stderr.on('end', function () {
40 | if (errorText.length > 0) {
41 | let error = new Error(errorText);
42 | if (callback) {
43 | callback(error);
44 | } else {
45 | throw error;
46 | }
47 | } else if (callback) {
48 | callback(error);
49 | }
50 | });
51 | }
52 |
53 | module.exports.open = open;
54 |
--------------------------------------------------------------------------------
/lib/vm.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const path = require('path');
4 | const fs = require('fs');
5 | const util = require('util');
6 | const jdfUtils = require('jdf-utils');
7 | const logger = require('jdf-log');
8 | const $ = jdfUtils.base;
9 | const f = jdfUtils.file;
10 | const jdf = require("./jdf");
11 | const velocity = require('velocityjs');
12 | const VFS = require('./VFS/VirtualFileSystem');
13 | const vm = module.exports;
14 |
15 | /**
16 | * @rander data
17 | * 格式：
18 | *
19 | *
20 | *
21 | * vm's content
22 | *
23 | * @{String} vmSource vm内容
24 | * @{Object} dataObj vm对应的数据
25 | * @{String} dirname vm的dirname
26 | */
27 | vm.render = function(vmSource, options) {
28 | let dataObj = options.dataObj;
29 | let dirname = options.dirname;
30 | let existMap = options.existMap;
31 |
32 | if (!(vmSource && dataObj)) {
33 | return '';
34 | }
35 |
36 | let macros = {
37 | parse: function (name) {
38 | let content = `\n`;
39 | let vmpath = path.resolve(dirname, name);
40 | let vmVfile = VFS.queryFile(vmpath);
41 | if (!vmVfile) {
42 | logger.error(`'#parse(${name})' in ${dirname}'s vm, path not exist or not a file`);
43 | return name;
44 | }
45 |
46 | // TODO content不将js css放进去，只放到cssMap，jsMap中
47 |
48 | // 添加#parse(vmpath)相应的css和js标签
49 | let vmName = path.basename(vmpath).replace(path.extname(vmpath), '');
50 | if (!existMap.cssMap[vmName]) {
51 | // 获取vfile，没有就不添加css标签到html中
52 | let csspath = vmpath.replace(path.extname(vmpath), '.css');
53 | csspath = path.relative(VFS.originDir, csspath);
54 | csspath = path.join(VFS.targetDir, csspath);
55 | let cssVfile = VFS.queryFile(csspath, 'target');
56 | if (cssVfile) {
57 | existMap.cssMap.set(vmName, true);
58 | }
59 | }
60 | if (!existMap.jsMap[vmName]) {
61 | let jspath = vmpath.replace(path.extname(vmpath), '.js');
62 | jspath = path.relative(VFS.originDir, jspath);
63 | jspath = path.join(VFS.targetDir, jspath);
64 | let jsVfile = VFS.queryFile(jspath, 'target');
65 | if (jsVfile) {
66 | existMap.jsMap.set(vmName, true);
67 | }
68 | }
69 | // 递归解析
70 | content += vm.render(vmVfile.targetContent, {
71 | dataObj: dataObj,
72 | dirname: path.dirname(vmpath),
73 | existMap: existMap
74 | });
75 |
76 | content += ``;
77 |
78 | return content;
79 | }
80 | }
81 |
82 | return velocity.render(vmSource, dataObj, macros);
83 | }
84 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jdfx",
3 | "description": "京东前端自动化构建工具",
4 | "version": "3.4.13",
5 | "author": {
6 | "name": "jdfx",
7 | "email": "chenxiaochun@jd.com"
8 | },
9 | "homepage": "https://github.com/jdf2e/jdf",
10 | "keywords": [
11 | "jdf",
12 | "jdfx",
13 | "build tools",
14 | "构建工具",
15 | "tool",
16 | "cli",
17 | "front-end",
18 | "webpack",
19 | "fe"
20 | ],
21 | "license": "MIT",
22 | "bin": {
23 | "jdf": "bin/jdf"
24 | },
25 | "engines": {
26 | "node": ">= 4.4.5"
27 | },
28 | "main": "index.js",
29 | "scripts": {
30 | "test": "mocha test/index.js"
31 | },
32 | "repository": {
33 | "type": "git",
34 | "url": "https://github.com/jdf2e/jdf.git"
35 | },
36 | "bugs": {
37 | "url": "https://github.com/jdf2e/jdf/issues"
38 | },
39 | "preferGlobal": true,
40 | "readmeFilename": "README.md",
41 | "dependencies": {
42 | "acorn": "^4.0.4",
43 | "atropa-jslint": "0.1.2",
44 | "autoprefixer": "^6.5.2",
45 | "axios": "^0.17.0",
46 | "babel-core": "^6.18.0",
47 | "babel-preset-env": "^1.7.0",
48 | "browser-sync": "2.21.0",
49 | "bs-html-injector": "^3.0.3",
50 | "cheerio": "^0.22.0",
51 | "clean-css": "2.1.8",
52 | "commander": "^2.9.0",
53 | "csslint": "0.10.0",
54 | "escape-string-regexp": "^1.0.5",
55 | "escodegen": "^1.8.1",
56 | "fs-extra": "^1.0.0",
57 | "glob": "^7.1.1",
58 | "html-minifier": "0.6.9",
59 | "htmllint": "0.0.7",
60 | "iconv-lite": "^0.4.10",
61 | "jdf-css-sprite": "^1.1.6",
62 | "jdf-img-minify": "0.1.0",
63 | "jdf-log": "^0.0.4",
64 | "jdf-upload": "^0.2.0",
65 | "jdf-utils": "^1.1.3",
66 | "js-beautify": "1.5.4",
67 | "jsmart": "^2.14.0",
68 | "less": "^2.7.1",
69 | "lodash": "^4.17.2",
70 | "minimatch": "^3.0.3",
71 | "node-sass": "^4.14.1",
72 | "node-watch": "^0.5.3",
73 | "postcss": "^5.2.5",
74 | "shelljs": "^0.7.5",
75 | "socket.io": "^2.0.4",
76 | "socket.io-client": "^2.0.4",
77 | "strip-json-comments": "^2.0.1",
78 | "uglify-es": "^3.1.3",
79 | "uglify-js": "2.6.0",
80 | "uuid": "^3.0.0",
81 | "velocityjs": "0.4.3"
82 | },
83 | "devDependencies": {
84 | "expect.js": "^0.3.1",
85 | "mocha": "^3.2.0"
86 | }
87 | }
88 |
--------------------------------------------------------------------------------
/template/config.json:
--------------------------------------------------------------------------------
1 | {
2 | "host": "192.168.181.73",
3 | "user": "arch",
4 | "password": "arch",
5 | "projectPath": "jdf_init", // 默认输出项目名称
6 | "compressThreadCrisis": 200, // 工程文件超过200个时开启多线程压缩
7 | "cdn": "//misc.360buyimg.com", // cdn前缀，如果不需要cdn，置成空字符串
8 | "output": {
9 | "cssCombo": true, // css进行combo
10 | "jsCombo": true, // js进行combo
11 |
12 | "compressJs": true, // 是否开启压缩js文件
13 | "compressCss": true, // 是否开启压缩css文件
14 | "compressImage": true, // 是否开启压缩图片
15 |
16 | "excludeFiles": "" // 不需要输出的文件/文件夹，路径相对于当前项目根目录，以逗号分隔，例如："test,test.css"
17 | },
18 | "plugins": [] // 引用的插件
19 | }
--------------------------------------------------------------------------------
/template/css/style.scss:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jdf2e/jdf/8ef48da64ca10305ee47e8c0aff6e23a3d647c37/template/css/style.scss
--------------------------------------------------------------------------------
/template/html/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
51 |
52 |
53 |
jdf 快速入门
54 |
2016-12-12
55 |
安装使用
56 |
57 |
jdf命令行工具是jdf前端集成解决方案的工具集，基于node.js和npm，jdf前需要先安装node.js，然后通过npm命令安装jdfx
58 |
59 |
npm install jdfx -g
60 |
61 |
安装测试，执行如下命令，如果出现版本号则说明你已安装成功
62 |
63 |
jdf -V
64 |
65 |
更新jdf
66 |
67 |
npm update jdfx -g
68 |
69 |
新建项目目录
70 |
71 |
在本机svn目录，主干上新建项目，比如product下项目test，即svn目录为/product/test
注：product为大项目名，test为测试项目
72 |
73 |
初始化项目
74 |
75 |
从命令行下进入test文件夹，在命令行执行如下命令，生成标准化的项目文件夹
76 |
77 |
jdf init [projectName]
78 |
79 |
test文件中里包括css、html、js、widget、config.json，其中config.json为配置文件，所有配置都需要修改此文件
80 |
81 |
注1：json文件不允许有注释，单双引号使用时也需要统一
注2：windows7下在当前文件夹打开命令行的方法：Shift+鼠标右键，选择"在此处打开命令窗口"
注3：windows下CMD路径常用操作如下
82 |
83 |
项目开发
84 |
85 |
在html，js，css等文件夹中新建相应文件
在widget文件夹新建抽离规划好的widget模块
在当前项目中，新建widget的命令为jdf widget -create xxx
86 |
87 |
本地预览调试
88 |
89 |
可以通过jdf build 在浏览器中查看构建后的当前工程，包括less，sass编译，widget编译等
90 |
91 |
jdf build
92 |
93 |
注意
94 |
95 |
96 | - 本地服务器默认启用80端口，如果此端口被占用，工具会自动启动一个新的端口：例如8080
97 | - 命令执行后工具本地服务器会一直运行，可以使用
ctrl+c命令退出本地server
98 | - 如果发现本地服务器在浏览器输出的文件夹和本地项目不一致，可通过
jdf clean，清除服务器后台缓存，强制同步一次
99 |
100 |
101 |
本地调试服务器启动成功后，可能通过jdf build -o命令自动打开浏览器，也可以复制http://localhost/在浏览上打开，jdf内置了browserSync，会自动同步刷新页面
102 |
103 |
项目输出
104 |
105 |
jdf output输出项目文件夹，包括压缩合并后的css，js，images，静态资源加cdn前缀，同时压缩所有图片
jdf output js/test.js css 自定义输出自己需要的文件或文件夹
106 |
107 |
项目联调和发布
108 |
109 |
jdf upload 发布至远端机器，主要包括css/js/widget，供产品，设计师查看效果，以及后端工程师联调
110 |
111 |
更多信息更参考：
112 |
113 | jdfx官方地址
114 |
115 |
118 |
119 |
120 |
121 |
--------------------------------------------------------------------------------
/test/buildOutputWidget.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const fs = require('fs');
4 | const path = require('path');
5 | const expect = require('expect.js');
6 | const logger = require('jdf-log');
7 |
8 | const VFS = require('../lib/VFS/VirtualFileSystem');
9 | const buildOutputWidget = require('../lib/buildOutputWidget');
10 | const widgetParser = require('../lib/buildWidget');
11 |
12 | describe('测试widgetOutputName', function () {
13 | logger.level(-1);
14 | describe('查找并解析{%widgetOutputName %}标签', function () {
15 | it('单行注释标签返回{}', function () {
16 | let comment1 = '';
17 | let info = widgetParser.parseOutputName(comment1);
18 | expect(info).to.eql({});
19 |
20 | let comment2 = ``;
21 | let info2 = widgetParser.parseOutputName(comment2);
22 | expect(info2).to.eql({});
23 | });
24 | it('多行注释标签返回{}', function () {
25 | let comment1 = ``;
29 | let info = widgetParser.parseOutputName(comment1);
30 | expect(info).to.eql({});
31 |
32 | let comment2 = ``;
36 | let info2 = widgetParser.parseOutputName(comment2);
37 | expect(info2).to.eql({});
38 | });
39 | it('widgetOutputName标签解析', function () {
40 | let comment = `{%widgetOutputName="name1"%}`;
41 | let info2 = widgetParser.parseOutputName(comment);
42 | expect(info2.name).to.equal('name1');
43 | });
44 | it('注释非注释写在一起', function () {
45 | let comment = `apaaabwww.jd.com
46 | {%widgetOutputName="name1"%}
47 |
48 | ad
49 | {%widgetOutputName="name3"%}
50 | `;
51 | let info2 = widgetParser.parseOutputName(comment);
52 | expect(info2.name).to.equal('name1');
53 | });
54 | it('一个html文档', function () {
55 | let html = `
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 | write in html, yes changed....
65 |
69 | {%widgetOutputName='output' %}
70 |
71 |
72 | `;
73 | let info = widgetParser.parseOutputName(html);
74 | expect(info.name).to.equal('output');
75 |
76 | });
77 | });
78 |
79 | describe('分别合并widget的css，js到一个文件', function () {
80 | let info = { name: 'output',
81 | text: '{%widgetOutputName="output" %}',
82 | concatTag: { js: true, css: true }
83 | };
84 | it('delete
87 | `
88 | }
89 | buildOutputWidget.delWidgetTagInHTML(info, htmlVfile);
90 | expect(htmlVfile.targetContent.replace(/\W*/g, '')).to.equal('');
91 |
92 | let htmlVfile1 = {
93 | targetContent: `
94 |
95 | `
96 | }
97 | buildOutputWidget.delWidgetTagInHTML(info, htmlVfile1);
98 | expect(htmlVfile1.targetContent).to.contain('./es6.js');
99 | });
100 | it('delete ', function () {
101 | let htmlVfile = {
102 | targetContent: `
103 | `
104 | }
105 | buildOutputWidget.delWidgetTagInHTML(info, htmlVfile);
106 | expect(htmlVfile.targetContent.replace(/\W*/g, '')).to.equal('');
107 |
108 | let htmlVfile1 = {
109 | targetContent: `
110 |
111 | `
112 | }
113 | buildOutputWidget.delWidgetTagInHTML(info, htmlVfile1);
114 | expect(htmlVfile1.targetContent).to.contain('./css1.css');
115 | });
116 | it('the css case ./i/a.png', function () {
117 | let vfile = {
118 | originPath: 'D:/TMP/bugfix/widget/a/a.css',
119 | targetContent: `.a {background: url(./i/a.png) no-repeat;}`
120 | };
121 | let targetDir = 'D:/TMP/bugfix/css';
122 | let transferContent = buildOutputWidget.cssPathRelative(vfile, targetDir);
123 | expect(transferContent).equal(`.a {background: url(../widget/a/i/a.png) no-repeat;}`);
124 | });
125 | it('the css case /i/a.png', function () {
126 | let vfile = {
127 | originPath: 'D:/TMP/bugfix/widget/a/a.css',
128 | targetContent: `.a {background: url(/i/a.png) no-repeat;}`
129 | };
130 | let targetDir = 'D:/TMP/bugfix/css';
131 | let transferContent = buildOutputWidget.cssPathRelative(vfile, targetDir);
132 | expect(transferContent).equal(`.a {background: url(/i/a.png) no-repeat;}`);
133 | });
134 | it('the css case "../b/i/b.png"', function () {
135 | let vfile = {
136 | originPath: 'D:/TMP/bugfix/widget/a/a.css',
137 | targetContent: `.a {background: url("../b/i/b.png") no-repeat;}`
138 | };
139 | let targetDir = 'D:/TMP/bugfix/css';
140 | let transferContent = buildOutputWidget.cssPathRelative(vfile, targetDir);
141 | expect(transferContent).equal(`.a {background: url(../widget/b/i/b.png) no-repeat;}`);
142 | });
143 | it('the css case //www.jd.com/b/i/b.png', function () {
144 | let vfile = {
145 | originPath: 'D:/TMP/bugfix/widget/a/a.css',
146 | targetContent: `.a {background: url(//www.jd.com/b/i/b.png) no-repeat;}`
147 | };
148 | let targetDir = 'D:/TMP/bugfix/css';
149 | let transferContent = buildOutputWidget.cssPathRelative(vfile, targetDir);
150 | expect(transferContent).equal(`.a {background: url(//www.jd.com/b/i/b.png) no-repeat;}`);
151 | });
152 | it('the js case all', function () {
153 | let vfile = {
154 | originPath: 'D:/TMP/bugfix/widget/a/a.js',
155 | targetContent: `define('b', [], function(require, module, exports){var a = require('/widget/a/a.js');seajs.use('../a/a.js');});`
156 | };
157 | let targetDir = 'D:/TMP/bugfix/js';
158 | let transferContent = buildOutputWidget.jsPathRelative(vfile, targetDir);
159 | expect(transferContent).equal(`define('b', ['/widget/a/a.js'], function (require, module, exports) {
160 | var a = require('/widget/a/a.js');
161 | seajs.use('../widget/a/a.js');
162 | });`);
163 | });
164 | });
165 |
166 |
167 | });
168 |
--------------------------------------------------------------------------------
/test/buildWidget.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const expect = require('expect.js');
4 | const logger = require('jdf-log');
5 | const escapeStringRegexp = require('escape-string-regexp');
6 |
7 | const buildWidget = require('../lib/buildWidget');
8 |
9 | let html = `
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 | {%widget name="nav" %}
22 | {%widget data='{"portal_floor_id": 0}'
23 | floorname="运营商-菜单"
24 | name="menu"
25 | cmsdata='{"floorclass": "floor-201707311537"}'%}
26 | {%widget name="slide" %}
27 | {%widget name="slide"%}
28 | {%widget name="slide"%}
29 |
30 | `;
31 |
32 | describe('测试buildWidget', function () {
33 | logger.level(-1);
34 | let widgetList = buildWidget.parseWidget(html);
35 | describe('查找并解析{%widget %}标签', function () {
36 | it('共有5个widget', function () {
37 | expect(widgetList.length).to.eql(5);
38 | });
39 | it('widget写在单行', function () {
40 | expect(widgetList[0].name).to.equal('nav');
41 | expect(widgetList[2].name).to.equal('slide');
42 | expect(widgetList[3].name).to.equal('slide');
43 | expect(widgetList[4].name).to.equal('slide');
44 | });
45 | it('widget属性分多行写', function () {
46 | expect(widgetList[1].name).to.equal('menu');
47 | expect(JSON.parse(widgetList[1].data).portal_floor_id).to.equal(0);
48 | expect(widgetList[1].text).to.equal(`{%widget data='{"portal_floor_id": 0}'
49 | floorname="运营商-菜单"
50 | name="menu"
51 | cmsdata='{"floorclass": "floor-201707311537"}'%}`);
52 | });
53 | it('widget相关文件名的正则检测', function () {
54 | let widgetInfo = {
55 | name: 'test.a'
56 | }
57 | let oBasename = 'test.a.a.js';
58 | let oBasename1 = 'test.a.js';
59 | let widgetNameReg = new RegExp(escapeStringRegexp(widgetInfo.name) + '\.\\w+$');
60 | expect(widgetNameReg.test(oBasename)).to.equal(false);
61 | expect(widgetNameReg.test(oBasename1)).to.equal(true);
62 | });
63 | });
64 |
65 | });
66 |
--------------------------------------------------------------------------------
/test/buildcss.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const fs = require('fs');
4 | const path = require('path');
5 | const expect = require('expect.js');
6 |
7 | const VFS = require('../lib/VFS/VirtualFileSystem');
8 | const buildCss = require('../lib/buildCss');
9 |
10 | describe('测试编译css', function () {
11 | let cssfileDir = path.join(process.cwd(), 'test/vfs/files');
12 | describe('buildcss in VFS', function () {
13 | it('#handleLess', function (done) {
14 | let filename = path.join(cssfileDir, 'less.less');
15 | let vfile = VFS.queryFile(filename);
16 | let tContent = vfile.targetContent;
17 | buildCss.handleLess(vfile).then(function () {
18 | expect(tContent).not.to.equal(vfile.targetContent);
19 | done();
20 | });
21 | });
22 | it('#handleSass', function (done) {
23 | let filename = path.join(cssfileDir, 'sass.scss');
24 | let vfile = VFS.queryFile(filename);
25 | let tContent = vfile.targetContent;
26 | buildCss.handleSass(vfile).then(function () {
27 | expect(tContent).not.to.equal(vfile.targetContent);
28 | done();
29 | });
30 | });
31 | it('#postCSSProcess', function (done) {
32 | let filename = path.join(cssfileDir, 'css.css');
33 | let vfile = VFS.queryFile(filename);
34 | let tContent = vfile.targetContent;
35 | buildCss.postCSSProcess(vfile).then(function () {
36 | expect(tContent).not.to.equal(vfile.targetContent);
37 | done();
38 | });
39 | });
40 | });
41 | });
42 |
--------------------------------------------------------------------------------
/test/config/config.json:
--------------------------------------------------------------------------------
1 | {
2 | "host": "ftpServerIp",
3 | "user": "anonymous",
4 | "password": "anonymous",
5 | "projectPath": "test/1.0.1",
6 | "output": {
7 | "cssAutoPrefixer": false,
8 | "excludeFiles": ["psd", "doc"]
9 | }
10 | }
--------------------------------------------------------------------------------
/test/config/index.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const fs = require('fs');
4 | const path = require('path');
5 | const expect = require('expect.js');
6 |
7 | const jdf = require('../../lib/jdf.js');
8 | const config = jdf.config;
9 |
10 | describe('读取配置文件', function () {
11 | let npmRoot = process.cwd();
12 |
13 | let userConfigPath = path.join(npmRoot, 'test/config/config.json');
14 | let userConfig = jdf.getUserConfig(userConfigPath);
15 | describe('jdf.getUserConfig()', function () {
16 | it('user projectPath in config.json should be test/1.0.1', function () {
17 | expect(userConfig.projectPath).to.equal('test/1.0.1');
18 | });
19 | });
20 |
21 | describe('jdf.mergeConfig()', function () {
22 | let env = path.join(npmRoot, 'test/config');
23 | process.chdir(env);
24 | jdf.init();
25 | let mergeConfig = jdf.mergeConfig();
26 | it('projectPath should be test/1.0.1', function () {
27 | expect(mergeConfig.projectPath).to.equal('test/1.0.1');
28 | });
29 | it('excludeFiles should be ["psd", "doc"]', function () {
30 | expect(mergeConfig.output.excludeFiles.length).to.equal(2);
31 | expect(mergeConfig.output.excludeFiles).to.eql(['psd', 'doc']);
32 | });
33 | process.chdir(npmRoot);
34 | });
35 |
36 | describe('jdf.init()', function () {
37 | let env = path.join(npmRoot, 'test/config');
38 | process.chdir(env);
39 | let mergeConfig = jdf.init();
40 | it('projectPath should be test/1.0.1', function () {
41 | expect(mergeConfig.projectPath).to.equal('test/1.0.1');
42 | });
43 | it('excludeFiles should be ["psd", "doc"]', function () {
44 | expect(mergeConfig.output.excludeFiles.length).to.equal(2);
45 | expect(mergeConfig.output.excludeFiles).to.eql(['psd', 'doc']);
46 | });
47 | it('jdf.currentDir should be ./test/config', function () {
48 | expect(jdf.currentDir.replace(/\\/g, '/')).to.match(/test\/config$/);
49 | });
50 | it('jdf.transferDir should be os.tmpdir() join jdf-temp/project/config', function () {
51 | expect(jdf.transferDir.replace(/\\/g, '/')).to.match(/\.jdf-temp\/project\/config$/);
52 | });
53 | it('jdf.outputDir should be relative to currentDir: build/test/1.0.1', function () {
54 | let relativePath = path.relative(jdf.currentDir, jdf.outputDir);
55 | expect(relativePath.replace(/\\/g, '/')).to.equal('build/test/1.0.1');
56 | });
57 | process.chdir(npmRoot);
58 | });
59 | });
60 |
--------------------------------------------------------------------------------
/test/index.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const path = require('path');
4 | const expect = require('expect.js');
5 |
6 | require('./vfs/virtual-file');
7 |
8 | const VFS = require('../lib/VFS/VirtualFileSystem');
9 | // npm run test
10 | const testDir = path.join(process.cwd(), './test');
11 | VFS.setOriginDir(testDir);
12 | VFS.setTargetDir(path.join(testDir, './build'));
13 | VFS.addIgnore('build', 'dir');
14 | VFS.readFilesInOriginDirSync();
15 |
16 | describe('加载文件到VFS', function () {
17 | it('read files success', function () {
18 | expect(VFS.fileList.length).to.be.above(0);
19 | });
20 | });
21 |
22 | require('./config');
23 |
24 | require('./buildcss');
25 |
26 | require('./urlReplace');
27 |
28 | require('./buildWidget');
29 |
30 | require('./buildOutputWidget');
31 |
32 |
33 |
34 |
--------------------------------------------------------------------------------
/test/urlReplace/comboUrlPath/case01.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | jdf-test
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/test/urlReplace/comboUrlPath/result01.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | jdf-test
8 |
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/test/vfs/files/QR.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jdf2e/jdf/8ef48da64ca10305ee47e8c0aff6e23a3d647c37/test/vfs/files/QR.jpg
--------------------------------------------------------------------------------
/test/vfs/files/css.css:
--------------------------------------------------------------------------------
1 | .css {
2 | display: flex;
3 | }
--------------------------------------------------------------------------------
/test/vfs/files/doc.docx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jdf2e/jdf/8ef48da64ca10305ee47e8c0aff6e23a3d647c37/test/vfs/files/doc.docx
--------------------------------------------------------------------------------
/test/vfs/files/es6.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | let vars = 'convert by Babel';
4 |
--------------------------------------------------------------------------------
/test/vfs/files/importless.less:
--------------------------------------------------------------------------------
1 | .less {
2 | .import {
3 | color: #ddd;
4 | }
5 | }
--------------------------------------------------------------------------------
/test/vfs/files/js.js:
--------------------------------------------------------------------------------
1 | console.log('read by VFS');
2 |
--------------------------------------------------------------------------------
/test/vfs/files/less.less:
--------------------------------------------------------------------------------
1 | @import "importless.less";
2 | @import "./css.css";
3 | .le {
4 | .ss {
5 | @color: #ccc;
6 | &:before {
7 | content: 'less read by VFS';
8 | color: @color;
9 | }
10 | }
11 | }
--------------------------------------------------------------------------------
/test/vfs/files/sass.scss:
--------------------------------------------------------------------------------
1 | @import "./css.css";
2 | .sa {
3 | $color: #ddd;
4 | .ss {
5 | &:before {
6 | content: 'sass read by VFS';
7 | color: $color;
8 | }
9 | }
10 | }
--------------------------------------------------------------------------------
/test/vfs/files/text.txt:
--------------------------------------------------------------------------------
1 | 这个文件不会被VFS读取。
2 | This file will not be read by VFS.
--------------------------------------------------------------------------------
/test/vfs/virtual-file.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | const fs = require('fs');
4 | const os = require('os');
5 | const path = require('path');
6 | const expect = require('expect.js');
7 | const esr = require('escape-string-regexp');
8 |
9 | const VFile = require('../../lib/VFS/VirtualFile');
10 |
11 | describe('测试VFile', function () {
12 | describe('must be absolute path', function () {
13 | let relativePath = './files/css.css';
14 | it(`should return {}: ${relativePath} `, function () {
15 | let vfile = new VFile(relativePath);
16 | expect(vfile).to.eql({});
17 | });
18 | let absPath = path.join(process.cwd(), './test/vfs', relativePath);
19 | it(`should success: ${absPath}`, function () {
20 | let vfile = new VFile(absPath);
21 | expect(vfile.originContent.replace(new RegExp(esr(os.EOL), 'g'), '\n')).to.equal('.css {\n display: flex;\n}');
22 | });
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
33 | #end
34 |
35 | * 2."$"用来标识一个变量，如
36 |
37 | $i、$msg.errorNum
38 |
39 | * 3."!"用来强制把不存在的变量显示为空白
40 |
41 | $!msg
42 |
43 | * 4.注释，如：
44 |
45 | ## 这是一行注释，不会输出
46 |
47 | ## velocity语法详解
48 |
49 | 具体更详细的语法可参考[官网] (http://velocity.apache.org/engine/devel/user-guide.html)
50 | 如vm.vm
51 |
52 |
53 | * 1.变量赋值输出
54 |
55 | Welcome $name to Javayou.com!
56 | today is $date.
57 | tdday is $mydae.//未被定义的变量将当成字符串
58 |
59 | * 2.设置变量值,所有变量都以$开头
60 |
61 | #set( $iAmVariable = "good!" )
62 | Welcome $name to Javayou.com!
63 | today is $date.
64 | $iAmVariable
65 |
66 | * 3.if,else判断
67 |
68 | #set ($admin = "admin")
69 | #set ($user = "user")
70 | #if ($admin == $user)
71 | Welcome admin!
72 | #else
73 | Welcome user!
74 | #end
75 |
76 | * 4.迭代数据List ($velocityCount为列举序号，默认从1开始)
77 |
78 | #foreach( $product in $allProducts )
79 |