cooking.demo.js 3.4 KB

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