vue2.0 項目build后資源文件報錯404的解決方案

當vue項目build后，我們會看到css、js報錯404的問題；

那我們就去找錯誤原因吧。

首先，查看build后的dist文件目錄

可以看出，js、css在index.html的同級目錄下；

然后，查看index.html，看到下面的代碼　

<script type=text/javascript src=/static/js/app.41ce5f66426864089c57.js></script>

我們先普及下文件路徑的知識    ../上級目錄   ./同級目錄  /根目錄

看上面的代碼，js、css文件的訪問是根目錄，所以我們只需要將根目錄改成同級目錄就可以了。

 

修改方法：找到config文件夾下的index.js文件

找到build.assetsPublicPath，將"/"修改成"./"

build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './'
    
   // 下面的省略 
｝

 

再次執行 npm run build 完美解決