cooking.demo.js 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  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: './examples/index.tpl',
  20. publicPath: process.env.CI_ENV || '/',
  21. hash: true,
  22. devServer: {
  23. port: 8085,
  24. log: false,
  25. publicPath: '/'
  26. },
  27. minimize: true,
  28. chunk: isProd ? {
  29. 'common': { name: ['element-ui', 'manifest'] }
  30. } : false,
  31. extractCSS: true,
  32. alias: config.alias,
  33. extends: ['vue2', 'lint'],
  34. postcss: config.postcss
  35. });
  36. cooking.add('loader.md', {
  37. test: /\.md$/,
  38. loader: 'vue-markdown-loader'
  39. });
  40. cooking.add('vueMarkdown', {
  41. use: [
  42. [require('markdown-it-anchor'), {
  43. level: 2,
  44. slugify: slugify,
  45. permalink: true,
  46. permalinkBefore: true
  47. }],
  48. [require('markdown-it-container'), 'demo', {
  49. validate: function(params) {
  50. return params.trim().match(/^demo\s*(.*)$/);
  51. },
  52. render: function(tokens, idx) {
  53. var m = tokens[idx].info.trim().match(/^demo\s*(.*)$/);
  54. if (tokens[idx].nesting === 1) {
  55. var description = (m && m.length > 1) ? m[1] : '';
  56. var html = convert(striptags(tokens[idx + 1].content, 'script'));
  57. var descriptionHTML = description
  58. ? '<div class="description">' + md.render(description) + '</div>'
  59. : '';
  60. return `<demo-block class="demo-box">
  61. <div class="source">${html}</div>
  62. <div class="meta">
  63. ${descriptionHTML}
  64. <div class="highlight">`;
  65. }
  66. return '</div></div></demo-block>\n';
  67. }
  68. }]
  69. ],
  70. preprocess: function(MarkdownIt, source) {
  71. MarkdownIt.renderer.rules.table_open = function() {
  72. return '<table class="table">';
  73. };
  74. MarkdownIt.renderer.rules.fence = wrap(MarkdownIt.renderer.rules.fence);
  75. return source;
  76. }
  77. });
  78. var wrap = function(render) {
  79. return function() {
  80. return render.apply(this, arguments)
  81. .replace('<code class="', '<code class="hljs ')
  82. .replace('<code>', '<code class="hljs">');
  83. };
  84. };
  85. if (isProd) {
  86. cooking.add('externals.vue', 'Vue');
  87. cooking.add('externals.vue-router', 'VueRouter');
  88. }
  89. cooking.add('vue.preserveWhitespace', false);
  90. module.exports = cooking.resolve();