utils.js 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. var path = require('path')
  2. var config = require('../config')
  3. var sass = require('sass')
  4. var MiniCssExtractPlugin = require('mini-css-extract-plugin')
  5. exports.assetsPath = function (_path) {
  6. var assetsSubDirectory = process.env.NODE_ENV === 'production'
  7. ? config.build.assetsSubDirectory
  8. : config.dev.assetsSubDirectory
  9. return path.posix.join(assetsSubDirectory, _path)
  10. }
  11. exports.cssLoaders = function (options) {
  12. options = options || {}
  13. function generateLoaders (loaders) {
  14. // Extract CSS when that option is specified
  15. // (which is the case during production build)
  16. if (options.extract) {
  17. return [MiniCssExtractPlugin.loader].concat(loaders)
  18. } else {
  19. return ['vue-style-loader'].concat(loaders)
  20. }
  21. }
  22. // http://vuejs.github.io/vue-loader/configurations/extract-css.html
  23. return [
  24. {
  25. test: /\.(post)?css$/,
  26. use: generateLoaders(['css-loader', 'postcss-loader']),
  27. },
  28. {
  29. test: /\.less$/,
  30. use: generateLoaders(['css-loader', 'postcss-loader', 'less-loader']),
  31. },
  32. {
  33. test: /\.sass$/,
  34. use: generateLoaders([
  35. 'css-loader',
  36. 'postcss-loader',
  37. {
  38. loader: 'sass-loader',
  39. options: {
  40. indentedSyntax: true
  41. }
  42. }
  43. ])
  44. },
  45. {
  46. test: /\.scss$/,
  47. use: generateLoaders(['css-loader', 'postcss-loader', 'sass-loader'])
  48. },
  49. {
  50. test: /\.styl(us)?$/,
  51. use: generateLoaders(['css-loader', 'postcss-loader', 'stylus-loader']),
  52. },
  53. ]
  54. }
  55. // Generate loaders for standalone style files (outside of .vue)
  56. exports.styleLoaders = function (options) {
  57. return exports.cssLoaders(options)
  58. }