Tengo un proyecto Webpack/React/Redux servido con Express y tengo algunos problemas para entender cómo encajan. Mi aplicación Express ejecuta Webpack y sirve mi archivo raíz index.html de la siguiente manera:
const app = express(); const server = require("http").createServer(app); app.use(bodyParser.json()); app.use("/some/path", express.static(path.join(__dirname, "/public"))); // webpack middleware const compiler = webpack(webpackConfig); const webpackDevMid = require("webpack-dev-middleware"); const webpackHotMid = require("webpack-hot-middleware"); app.use(webpackDevMid(compiler, { noInfo: true, publicPath: webpackConfig.output.publicPath // '/static/' })); app.use(webpackHotMid(compiler)); app.get("/", (req, res) => { if (!req.cookies.access_token) return res.redirect("/login"); return res.sendFile(path.join(__dirname, "index.html")); });Mi archivo de índice raíz tiene la etiqueta "raíz" en el cuerpo y el paquete web "/static/bundle.js" en una etiqueta de secuencia de comandos. La etiqueta raíz apunta a mi archivo index.js incluido en bundle.js y todo se procesa correctamente. Todo esto funciona bien.
Mi problema es que estoy tratando de incluir mi favicon.ico en mi raíz index.html, que no está incluido en Webpack, así que quiero servirlo como un archivo estático con Express, lo que suelo hacer con el código:
app.use("/some/path", express.static(path.join(__dirname, "/public")));Desafortunadamente, esta carpeta no se entrega al cliente y no puedo acceder a mi favicon fuera del paquete Webpack (al que mi index.html no tiene acceso discrecional). De hecho, nada de lo que trato de exponer al cliente de esta manera está funcionando. ¿Hay algo que no entiendo sobre webpack-dev-middleware o la forma en que funciona un servidor Express con Webpack? ¿Lo que da?
En su archivo webpack, asegúrese de tener:
target: 'node', node: { __dirname: false, },Ver:
Alternativamente, use path.join( '.' )
simplemente configure la carpeta estática como esta
app.use(express.static(__dirname + '/path-to-static-folder'));