解决vue-cli构建后的index.html找不到图标和引用的js、css文件路径错误的问题

1、config/index.js：

module.exports = { build: { // Paths assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', assetsPublicPath: './', } }

将上面的assetsPublicPath属性设置为“./”

2、build/utils.js：

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, fallback: 'vue-style-loader', publicPath: '/' //add }) } else { return ['vue-style-loader'].concat(loaders) } }

在上面的fallback属性后面添加publicPath属性，并将其属性值设置“/”。

这样设置后重新build，将dist下面所有的文件和文件夹放到服务器上后通过“/”访问即可。