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