cooking.demo.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. var cooking = require('cooking');
  2. var config = require('./config');
  3. var md = require('markdown-it')();
  4. var striptags = require('./strip-tags');
  5. var slugify = require('transliteration').slugify;
  6. var isProd = process.env.NODE_ENV === 'production';
  7. function convert(str) {
  8. str = str.replace(/(&#x)(\w{4});/gi, function($0) {
  9. return String.fromCharCode(parseInt(encodeURIComponent($0).replace(/(%26%23x)(\w{4})(%3B)/g, '$2'), 16));
  10. });
  11. return str;
  12. }
  13. cooking.set({
  14. entry: isProd ? {
  15. docs: './examples/entry.js',
  16. 'element-ui': './src/index.js'
  17. } : './examples/entry.js',
  18. dist: './examples/element-ui/',
  19. template: [
  20. {
  21. template: './examples/index.tpl',
  22. filename: './index.html',
  23. favicon: './examples/favicon.ico'
  24. }
  25. ],
  26. publicPath: process.env.CI_ENV || '/',
  27. hash: true,
  28. devServer: {
  29. port: 8085,
  30. log: false,
  31. publicPath: '/'
  32. },
  33. minimize: true,
  34. chunk: isProd ? {
  35. 'common': { name: ['element-ui', 'manifest'] }
  36. } : false,
  37. extractCSS: true,
  38. alias: config.alias,
  39. extends: ['vue2', 'lint'],
  40. postcss: config.postcss
  41. });
  42. cooking.add('loader.md', {
  43. test: /\.md$/,
  44. loader: 'vue-markdown-loader'
  45. });
  46. cooking.add('vueMarkdown', {
  47. use: [
  48. [require('markdown-it-anchor'), {
  49. level: 2,
  50. slugify: slugify,
  51. permalink: true,
  52. permalinkBefore: true
  53. }],
  54. [require('markdown-it-container'), 'demo', {
  55. validate: function(params) {
  56. return params.trim().match(/^demo\s*(.*)$/);
  57. },
  58. render: function(tokens, idx) {
  59. var m = tokens[idx].info.trim().match(/^demo\s*(.*)$/);
  60. if (tokens[idx].nesting === 1) {
  61. var description = (m && m.length > 1) ? m[1] : '';
  62. var content = tokens[idx + 1].content;
  63. var html = convert(striptags.strip(content, ['script', 'style']));
  64. var script = striptags.fetch(content, 'script');
  65. var style = striptags.fetch(content, 'style');
  66. var jsfiddle = { html: html, script: script, style: style };
  67. var descriptionHTML = description
  68. ? md.render(description)
  69. : '';
  70. jsfiddle = md.utils.escapeHtml(JSON.stringify(jsfiddle));
  71. return `<demo-block class="demo-box" :jsfiddle="${jsfiddle}">
  72. <div class="source" slot="source">${html}</div>
  73. ${descriptionHTML}
  74. <div class="highlight" slot="highlight">`;
  75. }
  76. return '</div></demo-block>\n';
  77. }
  78. }]
  79. ],
  80. preprocess: function(MarkdownIt, source) {
  81. MarkdownIt.renderer.rules.table_open = function() {
  82. return '<table class="table">';
  83. };
  84. MarkdownIt.renderer.rules.fence = wrap(MarkdownIt.renderer.rules.fence);
  85. return source;
  86. }
  87. });
  88. var wrap = function(render) {
  89. return function() {
  90. return render.apply(this, arguments)
  91. .replace('<code class="', '<code class="hljs ')
  92. .replace('<code>', '<code class="hljs">');
  93. };
  94. };
  95. if (isProd) {
  96. cooking.add('externals.vue', 'Vue');
  97. cooking.add('externals.vue-router', 'VueRouter');
  98. }
  99. cooking.add('vue.preserveWhitespace', false);
  100. module.exports = cooking.resolve();