Webpack + Angular2错误的publicPath? [英] Webpack + Angular2 wrong publicPath?
问题描述
我正在尝试使Angular 2 + Webpack正常工作-我快到了:)
I am trying to get Angular 2 + Webpack working - and I am almost there :)
我需要解决的最后一个问题是:
The last problem i need to solve is:
浏览子路径(例如/childroute/main)时，只要我使用路由器链接，一切都会按预期运行.
当手动输入地址或进行重新加载时，我得到了错误的束路径404.它应该是localhost:5001/dist/bundle.js，但是webpack尝试获取localhost:5001/childroute/dist/bundle.js.在webpack中更改我的publicPath不起作用:(
When browsing a child route (e.g. /childroute/main) everything works as intended, as long as I use router-links.
When entering the adress manually or doing a reload i get a 404 with wrong bundle paths..
It should be localhost:5001/dist/bundle.js , but webpack tries to get localhost:5001/childroute/dist/bundle.js . Changing my publicPath in webpack did not work :(
这是我的webpack配置:
Here is my webpack config:
"use strict";
var webpack = require('webpack');
var path = require('path');
module.exports = {
entry: {
"app": "./wwwroot/app/base/boot",
"vendor": "./wwwroot/app/base/vendors"
},
devtool: 'source-map',
output: {
filename: "bundle.js",
chunkFilename: "[id]chunk.js",
path: "./wwwroot/dist/",
publicPath: "./dist/"
},
//devServer: {
// contentBase: "./wwwroot/",
// host: "localhost",
// port: 50001,
// inline:true
//},
resolve: {
extensions: ['','.js','.ts']
},
module: {
loaders: [
//Typescript
{
test: /\.ts$/,
loader: 'ts-loader',
exclude: '/node_modules/'
},
// SASS
{
test: /\.scss$/,
loaders: ['style','css','sass'],
exclude: '/node_modules/'
},
// Fonts & Files
{
test: /\.(ttf|eot|txt|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/,
loader: 'file-loader' ,
exclude: '/node_modules/'
}
]
},
plugins: [
//new webpack.optimize.UglifyJsPlugin({
// compressor: {
// warnings: false
// }
//}),
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery"
}),
new webpack.optimize.CommonsChunkPlugin("vendor","vendor_bundle.js")
]
};
我希望有人能给我一个提示:)
谢谢大家！
I hope someone could give me a hint :)
Thanks guys!
如果我将index.html中的脚本路径从"dist/bundle.js"更改为"/dist/bundle.js"，则会加载脚本，但是angular找不到我的模板...相同错误，模板路径中带有附加的"/childroute/".
If I change script paths in index.html from "dist/bundle.js" to "/dist/bundle.js", I get the scripts loaded, but angular does not find my templates then... same error with an additional "/childroute/" in template path..
推荐答案
(如果您添加 base 标记到index.html，所有资源都是相对于基本路径而不是相对于当前路径相对加载的.
if you add a base tag to your index.html all resources are loaded relative from the base path and not relative from your current route.
<head>
<base href="/">
</head>
这篇关于Webpack + Angular2错误的publicPath?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
