英文:
How to link pages in Webpack 5 + Pug?
问题
我有一个基本的webpack模板，带有pug-loader。我有一个入口pug文件。当我在开发服务器上开发时，我需要一个可以链接到另一个页面（也是用pug编写的）的工作链接。我该怎么做？我应该将pug文件编译成HTML文件并链接HTML页面吗？我知道浏览器不读取pug，只是不知道如何正确设置它。
我刚刚写了一个链接到另一个.pug页面，但我总是收到404错误。自动创建HTML文件已经设置好了以进行构建。
英文:
I have a basic webpack template with pug-loader. I have an entry pug file. When I develop on dev server, I need working link to another page (also written in pug). How can I do that? Should I compile pug files to html in my src directory and link html pages instead? I know browser doesn't read pug, just don't know how to set up it right
I just wrote a link to another .pug page and I always get 404. Auto creating of html files is set up for building
答案1
得分: 1
Here is the translated code:
已解决。需要使用以下代码和url-loader：
{
test: /\.(html)$/i,
use: [
{
loader: 'url-loader',
options: {
// The `mimetype` and `encoding` arguments will be obtained from your options
// The `resourcePath` argument is the path to the file.
generator: (content, mimetype, encoding, resourcePath) => {
if (/\.html$/i.test(resourcePath)) {
return `data:${mimetype},${content.toString()}`;
}
return `data:${mimetype}${encoding ? `;${encoding}` : ''},${content.toString(encoding)}`;
},
},
},
],
}
Please note that the code part is translated, and I have excluded the request for further translation.
英文:
Resolved myself. Needs to use url-loader with following code:
{
test: /\.(html)$/i,
use: [
{
loader: 'url-loader',
options: {
// The `mimetype` and `encoding` arguments will be obtained from your options
// The `resourcePath` argument is path to file.
generator: (content, mimetype, encoding, resourcePath) => {
if (/\.html$/i.test(resourcePath)) {
return `data:${mimetype},${content.toString()}`;
}
return `data:${mimetype}${
encoding ? `;${encoding}` : ''
},${content.toString(encoding)}`;
},
},
},
],
},
And write links to other pug files like they paths in dist are, with .html extension
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论