许多问候开发社区。祝大家... 自昨天以来我一直面临着一种情况 我正在构建一个Whats App克隆应用(https://github.com/adrielwerlich/curso-hcode-whatsapp-clone)
1-运行构建命令 2-运行firebase deploy --only托管命令
但这是我得到的屏幕
Firebase仪表板正在显示
欢迎任何帮助...非常感谢...
我能够取得一些进步
1-已添加到
new HtmlWebpackPlugin({
template: './index.html',
})
,现在有适当的html内容...
但是当我尝试使用firebase serve
答案 0 :(得分:0)
发现捆绑包仅创建了js文件,并且还必须配置HtmlWebpackPlugin以创建HTML文件之后,问题是使js文件对html文件可见。
因此,使捆绑软件在本地firebase serve
命令和远程Firebase托管服务中运行的最终解决方案...
整个问题都与webpack捆绑包配置有关
const path = require('path')
var HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
entry:{
app:'./src/app.js',
'pdf.worker':'pdfjs-dist/build/pdf.worker.entry.js'
},
output:{
filename:'[name].bundle.js',
path: path.join(__dirname, '/dist'),
publicPath:'/' // the issue was here. Instead of /dist only / makes the js bundle files visible inside the html index file
},
module: {
loaders: [
{
test: /\.css/,
loaders: ['style-loader', 'css-loader']
// include: __dirname + '/'
},
{
test: /.(gif|png|jpe?g|webp|svg)$/i,
use: [
'file-loader',
{
loader: 'image-webpack-loader',
options: {
webp: {
quality: 80
}
}
}
]
}
],
},
plugins: [
new HtmlWebpackPlugin({
template: './index.html',
})
]
}
,并且还必须配置de css样式的加载器和图像Webpack加载器,以便在firebase本地服务器和firebase远程托管服务中正常运行
遇到了捆绑包生成器配置的小细节...许多小时的焦虑...