如何設置Angular 2＆webpack項目從上下文路徑中檢索圖像？

使用角2的WebPack首發位置：https://github.com/AngularClass/angular2-webpack-starter 如何設置Angular 2＆webpack項目從上下文路徑中檢索圖像？

我想在http://localhost:3000/contextPath訪問應用程序，而不是http://localhost:3000

我在webpack.dev.js下輸出增加了publicPath設置：

output: { 
    publicPath: '/contextPath', 
    path: helpers.root('dist'), 
    filename: '[name].bundle.js', 
    sourceMapFilename: '[name].map', 
    chunkFilename: '[id].chunk.js', 
    library: 'ac_[name]', 
    libraryTarget: 'var', 
    },

，並設置webpack.common.js中的baseUrl：

const METADATA = { 
    title: 'Angular2 Webpack Starter by @gdi2290 from @AngularClass', 
    baseUrl: '/contextPath', 
    isDevServer: helpers.isWebpackDevServer() 
};

運行webpack-dev-server後，我可以訪問應用程序http://localhost:3000/contextPath#/home，使用上下文路徑（如http://localhost:3000/contextPath/polyfills.bundle.js）正確地提供.js文件，但角盾圖像已損壞，頁面正試圖從http://localhost:3000/assets/img/angularclass-avatar.png中檢索它。

我應該如何讓應用程序使用正確的url（包括上下文路徑），這是http://localhost:3000/contextPath/assets/img/angularclass-avatar.png？

應用程序運行在與破碎的形象聯繫上下文路徑：

來源

2016-08-24 user506069

這兩個baseUrl和publicPath在我的webpack配置文件需要在最後包含斜線。將它們設置爲'/contextPath/'解決了問題。

來源

2016-08-30 18:21:39 user506069

我相信你是想設置publicPath屬性。嘗試設置：

output.publicPath: '/contextPath'。

來源

2016-08-24 15:37:47

我相信已經在webpack.dev.js中設置了，但也許這不是正確的地方？它似乎影響其他內容，如.js文件，但不影響屏蔽圖像。 – user506069

你只想讓它影響你的圖片路徑嗎？ –

不，我想從上下文路徑提供的一切，所以js文件都很好。儘管我設置了publicPath，但圖像並沒有使用它，這對我來說似乎很奇怪，因爲其他資源都這樣。 – user506069

如何設置Angular 2＆webpack項目從上下文路徑中檢索圖像？

回答

相關問題