cooking.demo.js 3.3 KB

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