UNPKG

3.1 kBJavaScriptView Raw
1
2const md = require("./md");
3const getInlineCompInstance = require('./get-inline-comp');
4
5const separateTemplate = (str) => {
6 str=str.trim();
7 if(!str) return str;
8 res = str.match(/<(template)>([\s\S]+)<\/\1>/);
9 return res && res[2] ? res[2].trim() : '';
10}
11
12const separateStyle = (str) => {
13 res = str.match(/<(style)>([\s\S]+)<\/\1>/);
14 return res && res[2] ? res[2].trim() : '';
15}
16
17const separateScript = (str) => {
18 // res = str.match(/<(script)>([\s\S]+)<\/\1>/);
19 res=str.match(/export([\s])default([\s\S]+)<\/script>/);
20 return res && res[2] ? 'export default '+res[2].trim() : '';
21}
22
23const separateImports = (str)=>{
24 res = str.match(/<(script)>([\s\S]+)export/);
25 return res && res[2] ? res[2].trim() : '';
26}
27
28
29module.exports = function (source) {
30
31 let output = [];
32 let startIndex = 0;
33 let compInstancesString = '';
34 let compStylesString = '';
35 let compScriptHeaderString = '';
36
37 let id = 0; // demo 的 id
38 const content = md.render(source);
39 const startTag = '<!--kview-demo:';
40 const endTag = ':kview-demo-->';
41 const startTagLen = startTag.length;
42 const endTagLen = endTag.length;
43
44
45 let compStartIndex = content.indexOf(startTag),
46 compEndIndex = content.indexOf(endTag, compStartIndex + startTagLen);
47
48 //md文件解析
49 while (compStartIndex !== -1 && compEndIndex !== -1) { //存在kview组件模板
50 output.push(content.slice(startIndex, compStartIndex)); //组件前的字符串
51 const compTpl = content.slice(compStartIndex + startTagLen, compEndIndex);
52 const templateTpl = separateTemplate(compTpl);
53 const scriptTpl = separateScript(compTpl);
54 const importTpl = separateImports(compTpl);
55 const styleTpl = separateStyle(compTpl);
56 let code = getInlineCompInstance(templateTpl, scriptTpl,styleTpl);
57 const demoComponentName = `kview-demo-${id}`;
58 output.push(`<template slot="instance"><${demoComponentName} /></template>`);
59
60 compInstancesString += `${JSON.stringify(demoComponentName)}: ${code},`;
61 compStylesString+=styleTpl;
62 compScriptHeaderString+=importTpl;
63 // 重新计算下一次的位置
64 id++;
65 startIndex = compEndIndex + endTagLen;
66 compStartIndex = content.indexOf(startTag, startIndex);
67 compEndIndex = content.indexOf(endTag, compStartIndex + startTagLen);
68 }
69
70 let pageScript = '';
71 if (compInstancesString) {
72 pageScript = `<script>
73 ${compScriptHeaderString}
74 export default {
75 name: 'component-kview',
76 components: {
77 ${compInstancesString}
78 }
79 }
80 </script>`;
81 } else if (content.indexOf('<script>') === 0) { // 硬编码,有待改善
82 startIndex = content.indexOf('</script>') + '</script>'.length;
83 pageScript = content.slice(0, startIndex);
84 }
85
86 output.push(content.slice(startIndex));
87 return `
88 <template>
89 <div class="content">
90 ${output.join('')}
91 </div>
92 </template>
93 ${pageScript}
94 <style>
95 ${compStylesString}
96 </style>
97 `;
98}
\No newline at end of file