当我在webpack中使用此配置时,默认情况下是pinax的帐户启动项目:
new HtmlWebpackPlugin({
filename: projectTemplatesRoot + "_styles.html",
templateContent: function(templateParams, compilation) {
var link = "";
for (var css in templateParams.htmlWebpackPlugin.files.css) {
link += "<link href='" + templateParams.htmlWebpackPlugin.files.css[css] + "' rel='stylesheet' />\n"
}
return link;
}
}),
生成以下文件:
<link href='\site_media\static\css/site.css?5967f340b74047fcb05b' rel='stylesheet' />
Javascript生成器也是如此。
Firefox上的反斜杠断开,无法显示任何主题。 Django服务器显示以下请求 - 响应:
[03/Dec/2015 15:07:02] "GET /account/login/%5Csite_media%5Cstatic%5Ccss/site.css?5967f340b74047fcb05b HTTP/1.1" 404 4258
注意%5C是反斜杠,404错误。 我在Windows上,如果这对w.r.t有任何影响。斜杠。
修改 这是我的完整webpack.config.js:
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var HtmlWebpackPlugin = require("html-webpack-plugin");
var path = require("path");
var webpack = require("webpack");
var projectTemplatesRoot = "../../ardiff_frontend/templates/";
module.exports = {
context: path.resolve(__dirname, "src"),
entry: {
app: "./js/main.js"
},
output: {
path: path.resolve(__dirname, "dist"),
filename: "js/site.js?[hash]",
publicPath: "/site_media/static"
},
module: {
loaders: [
{
test: /\.(gif|png|ico|jpg|svg)$/,
include: [
path.resolve(__dirname, "src/images")
],
loader: "file-loader?name=/images/[name].[ext]"
},
{ test: /\.less$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader!less-loader") },
{
test: /\.(woff|woff2|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
include: [
path.resolve(__dirname, "/src/fonts"),
path.resolve(__dirname, "../node_modules")
],
loader: "file-loader?name=/fonts/[name].[ext]?[hash]"
},
{ test: /\.jsx?$/, loader: "babel-loader", query: {compact: false} },
]
},
resolve: {
extensions: ["", ".js", ".jsx"],
},
plugins: [
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
new ExtractTextPlugin("css/site.css?[hash]"),
new HtmlWebpackPlugin({
filename: projectTemplatesRoot + "_styles.html",
templateContent: function(templateParams, compilation) {
var link = "";
for (var css in templateParams.htmlWebpackPlugin.files.css) {
link += "<link href='" + templateParams.htmlWebpackPlugin.files.css[css] + "' rel='stylesheet' />\n"
}
return link;
}
}),
new HtmlWebpackPlugin({
filename: projectTemplatesRoot + "_scripts.html",
templateContent: function(templateParams, compilation) {
var script = "";
for (var js in templateParams.htmlWebpackPlugin.files.js) {
script += "<script src='" + templateParams.htmlWebpackPlugin.files.js[js] + "'></script>\n"
}
return script;
}
})
]
};
编辑2:我的settings.py文件的相关部分:
# URL that handles the media served from MEDIA_ROOT. Make sure to use a
# trailing slash.
# Examples: "http://media.lawrence.com/media/", "http://example.com/media/"
MEDIA_URL = "/site_media/media/"
# Absolute path to the directory static files should be collected to.
# Don"t put anything in this directory yourself; store your static files
# in apps" "static/" subdirectories and in STATICFILES_DIRS.
# Example: "/home/media/media.lawrence.com/static/"
STATIC_ROOT = os.path.join(PACKAGE_ROOT, "site_media", "static")
# URL prefix for static files.
# Example: "http://media.lawrence.com/static/"
STATIC_URL = "/site_media/static/"
# Additional locations of static files
STATICFILES_DIRS = [
os.path.join(PROJECT_ROOT, "static", "dist"),
]