utils.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. 'use strict'
  2. const path = require('path')
  3. const config = require('../config')
  4. const ExtractTextPlugin = require('extract-text-webpack-plugin')
  5. const packageConfig = require('../package.json')
  6. // console.log(process.env.NODE_ENV)
  7. let themeConfig = process.env.NODE_ENV === 'private' ? `@import "~@/style/private.scss";` : `@import "~@/style/online.scss";`;
  8. exports.assetsPath = function (_path) {
  9. const assetsSubDirectory = process.env.NODE_ENV === 'production'
  10. ? config.build.assetsSubDirectory
  11. : config.dev.assetsSubDirectory
  12. return path.posix.join(assetsSubDirectory, _path)
  13. }
  14. exports.cssLoaders = function (options) {
  15. options = options || {}
  16. const cssLoader = {
  17. loader: 'css-loader',
  18. options: {
  19. sourceMap: options.sourceMap
  20. }
  21. }
  22. const postcssLoader = {
  23. loader: 'postcss-loader',
  24. options: {
  25. sourceMap: options.sourceMap
  26. }
  27. }
  28. // generate loader string to be used with extract text plugin
  29. function generateLoaders (loader, loaderOptions) {
  30. const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
  31. if (loader) {
  32. loaders.push({
  33. loader: loader + '-loader',
  34. options: Object.assign({}, loaderOptions, {
  35. sourceMap: options.sourceMap
  36. })
  37. })
  38. }
  39. // Extract CSS when that option is specified
  40. // (which is the case during production build)
  41. if (options.extract) {
  42. return ExtractTextPlugin.extract({
  43. use: loaders,
  44. fallback: 'vue-style-loader',
  45. publicPath: '../../'
  46. })
  47. } else {
  48. return ['vue-style-loader'].concat(loaders)
  49. }
  50. }
  51. // https://vue-loader.vuejs.org/en/configurations/extract-css.html
  52. return {
  53. css: generateLoaders(),
  54. postcss: generateLoaders(),
  55. less: generateLoaders('less'),
  56. sass: generateLoaders('sass', {
  57. indentedSyntax: true ,
  58. data: themeConfig}),
  59. scss: generateLoaders('sass', {
  60. data: themeConfig,
  61. }),
  62. stylus: generateLoaders('stylus'),
  63. styl: generateLoaders('stylus')
  64. }
  65. }
  66. // Generate loaders for standalone style files (outside of .vue)
  67. exports.styleLoaders = function (options) {
  68. const output = []
  69. const loaders = exports.cssLoaders(options)
  70. for (const extension in loaders) {
  71. const loader = loaders[extension]
  72. output.push({
  73. test: new RegExp('\\.' + extension + '$'),
  74. use: loader
  75. })
  76. }
  77. return output
  78. }
  79. exports.createNotifierCallback = () => {
  80. const notifier = require('node-notifier')
  81. return (severity, errors) => {
  82. if (severity !== 'error') return
  83. const error = errors[0]
  84. const filename = error.file && error.file.split('!').pop()
  85. notifier.notify({
  86. title: packageConfig.name,
  87. message: severity + ': ' + error.name,
  88. subtitle: filename || '',
  89. icon: path.join(__dirname, 'logo.png')
  90. })
  91. }
  92. }