cooking.demo.js 2.7 KB

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