Vite-plugin-handlebars 不适用于嵌套在 /public 中的任何页面。例如,about.html 嵌套在 /public 中,因为 Vite 在运行构建时将其捆绑到根目录中。但是,这给我的车把带来了问题。它们在 index.html 中工作,但不适用于 /public 中的任何页面。
我的根设置
├── package.json
├── vite.config.js
├── index.html
└── public
├── about.html
└── partials
├── _head.hbs
└── _nav.hbs
vite.config.js
import { resolve } from 'path';
import handlebars from 'vite-plugin-handlebars';
import { defineConfig } from 'vite';
const pageData = {
'/index.html': {
title: 'Home',
},
'/about.html': {
title: 'About',
},
};
export default defineConfig({
base: '/',
assetsInclude: ['partials/_nav.hbs', 'partials/_head.hbs', 'partials/_footer.hbs'],
server: {
host: true
},
plugins: [
handlebars({
partialDirectory: resolve(__dirname, './public/partials'),
context(pagePath) {
return pageData[pagePath];
},
}),
],
});
package.json
{
"name": "v",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"devDependencies": {
"postcss-scss": "^4.0.6",
"sass": "^1.57.0",
"vite": "^4.0.0",
"vite-plugin-handlebars": "^1.6.0"
},
"dependencies": {
"@rollup/plugin-inject": "^5.0.2",
"feather-icons": "^4.29.0",
"smooth-scroll": "^16.1.3"
}
}
index.html
<!DOCTYPE html>
<html lang="en">
{{> _head }}
<body>
<div id="app" class="desktop">
{{> _nav }}
<div id="content" class="content">
这对我有用:
partialDirectory: resolve(__dirname, 'src','hbs','partials'),