After Vue project to distribute a CSS background images do not show

I believe many students are just beginning to learn vue encountered packaged items found after the release of the CSS background image does not show specifically how to solve only need to change the configuration to bind

Modify  build / utils.js  in  generateLoaders  method, the following code, increasing  publicPath: '... / ... /'

// generate loader string to be used with extract text plugin
  function generateLoaders (loader, loaderOptions) {
    const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]

    if (loader) {
      loaders.push({
        loader: loader + '-loader',
        options: Object.assign({}, loaderOptions, {
          sourceMap: options.sourceMap
        })
      })
    }

    // Extract CSS when that option is specified
    // (which is the case during production build)
    if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        publicPath: '../../',
        fallback: 'vue-style-loader'
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }
  }

 

Guess you like

Origin www.cnblogs.com/guoliping/p/11112733.html