cooking.demo.js 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. var cooking = require('cooking');
  2. var config = require('./config');
  3. var md = require('markdown-it')();
  4. var Components = require('../components.json');
  5. var striptags = require('./strip-tags');
  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-container'), 'demo', {
  38. validate: function(params) {
  39. return params.trim().match(/^demo\s*(.*)$/);
  40. },
  41. render: function(tokens, idx) {
  42. var m = tokens[idx].info.trim().match(/^demo\s*(.*)$/);
  43. if (tokens[idx].nesting === 1) {
  44. var description = (m && m.length > 1) ? m[1] : '';
  45. var html = convert(striptags(tokens[idx + 1].content, 'script'));
  46. var descriptionHTML = description
  47. ? '<div class="description">' + md.render(description) + '</div>'
  48. : '';
  49. return `<demo-block class="demo-box">
  50. <div class="source">${html}</div>
  51. <div class="meta">
  52. ${descriptionHTML}
  53. <div class="highlight">`;
  54. }
  55. return '</div></div></demo-block>\n';
  56. }
  57. }]
  58. ],
  59. preprocess: function(MarkdownIt, source) {
  60. MarkdownIt.renderer.rules.table_open = function() {
  61. return '<table class="table">';
  62. };
  63. MarkdownIt.renderer.rules.fence = wrap(MarkdownIt.renderer.rules.fence);
  64. return source;
  65. }
  66. });
  67. var wrap = function(render) {
  68. return function() {
  69. return render.apply(this, arguments)
  70. .replace('<code class="', '<code class="hljs ')
  71. .replace('<code>', '<code class="hljs">');
  72. };
  73. };
  74. var externals = {};
  75. Object.keys(Components).forEach(function(key) {
  76. externals[`element-ui/packages/${key}/style.css`] = 'null';
  77. });
  78. // 开发模式不需要将不存在的 style.css 打包进去
  79. cooking.add('externals', externals);
  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. module.exports = cooking.resolve();