utils.js 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. const ExtractTextPlugin = require('extract-text-webpack-plugin');
  2. exports.cssLoaders = function (options) {
  3. options = options || {}
  4. var cssLoader = {
  5. loader: 'css-loader',
  6. options: {
  7. minimize: process.env.NODE_ENV === 'production',
  8. sourceMap: options.sourceMap
  9. }
  10. }
  11. // generate loader string to be used with extract text plugin
  12. function generateLoaders (loader, loaderOptions) {
  13. var loaders = [cssLoader]
  14. if (loader) {
  15. loaders.push({
  16. loader: loader + '-loader',
  17. options: Object.assign({}, loaderOptions, {
  18. sourceMap: options.sourceMap
  19. })
  20. })
  21. }
  22. // Extract CSS when that option is specified
  23. // (which is the case during production build)
  24. if (options.extract) {
  25. return ExtractTextPlugin.extract({
  26. use: loaders,
  27. fallback: 'vue-style-loader'
  28. })
  29. } else {
  30. return ['vue-style-loader'].concat(loaders)
  31. }
  32. }
  33. // http://vuejs.github.io/vue-loader/en/configurations/extract-css.html
  34. return {
  35. css: generateLoaders(),
  36. postcss: generateLoaders(),
  37. less: generateLoaders('less'),
  38. sass: generateLoaders('sass', { indentedSyntax: true }),
  39. scss: generateLoaders('sass'),
  40. stylus: generateLoaders('stylus'),
  41. styl: generateLoaders('stylus')
  42. }
  43. }
  44. // Generate loaders for standalone style files (outside of .vue)
  45. exports.styleLoaders = function (options) {
  46. var output = []
  47. var loaders = exports.cssLoaders(options)
  48. for (var extension in loaders) {
  49. var loader = loaders[extension]
  50. output.push({
  51. test: new RegExp('\\.' + extension + '$'),
  52. use: loader
  53. })
  54. }
  55. return output
  56. }