foundation / foundation/panini
Panini standalone setup
- Dominant language
- JavaScript
- Stars
- 593
- Forks
- 104
- PR merge metrics
- No merged PRs in 30d
Description
Hello,
I'm interested in using the standalone panini in my project. However, I'm struggling to get it to work and recognize my partials. I've set up my Panini gulp task as so:
```
// fix for autoprefixer
require('es6-promise').polyfill();
// Plugins
var browserSync = require('browser-sync'),
connectPhp = require('gulp-connect-php'),
concat = require('gulp-concat'),
copy = require('gulp-copy'),
del = require('del'),
gls = require('gulp-live-server'),
gulp = require('gulp'),
gutil = require('gulp-util'),
imagemin = require('gulp-imagemin'),
notify = require('gulp-notify'),
panini = require('panini'),
plumber = require('gulp-plumber'),
rename = require('gulp-rename'),
svgmin = require('gulp-svgmin'),
svgsymbols = require('gulp-svg-symbols'),
reload = browserSync.reload,
watch = require('gulp-watch');
var filesPages = ['src/pages/*.html'];
var filesPartials = ['src/{layouts,pages,partials}/**/*.html'];
var filesCss = ['src/assets/css/**/*.css'];
var filesImages = ['src/assets/images/*.{jpg,png,gif,webp}'];
var filesFonts = ['src/assets/fonts/**/*.{eot,svg,ttf,woff,woff2}'];
var filesSvg = [
'src/assets/svg/**/*.svg',
'!src/assets/svg/**/svg-symbols.{svg,css}'
];
var filesCopy = [
'src/pages/*.html',
'src/assets/css/*.css',
'src/assets/svg/svg-symbols.{css,svg}',
'src/assets/images/**/.{gif,jpg,png,webp}',
'src/assets/fonts/**/*.{eot,svg,ttf,woff,woff2}'
];
var dirDist = ['dist'];
// BEGIN TASKS
gulp.task('pages', function() {
return gulp.src(filesPages)
.pipe(panini({
root: 'src/pages/',
layouts: 'src/layouts/',
partials: 'src/partials/',
helpers: 'src/src/helpers/',
data: 'src/data/'
}))
.pipe(plumber({errorHandler: notify.onError('Error: <%= error.message %>')}))
.pipe(gulp.dest(dirDist))
.pipe(reload({
stream: true
}));
});
gulp.task('images', function() {
return gulp.src(filesImages)
.pipe(imagemin())
.pipe(plumber({errorHandler: notify.onError('Error: <%= error.message %>')}))
.pipe(gulp.dest(dirDist + '/assets/images'))
.pipe(reload({
stream: true
}));
});
gulp.task('svgsprite', function() {
return gulp.src(filesSvg)
.pipe(svgmin())
.pipe(svgsymbols({
templates: ['default-svg', 'default-css']
}))
.pipe(plumber({errorHandler: notify.onError('Error: <%= error.message %>')}))
.pipe(gulp.dest(dirDist + '/assets/svg'))
.pipe(reload({
stream: true
}));
});
gulp.task('copy', function() {
return gulp.src(filesCopy)
.pipe(plumber({errorHandler: notify.onError('Error: <%= error.message %>')}))
.pipe(gulp.dest(dirDist))
.pipe(reload({
stream: true
}));
});
gulp.task('connectSync', function() {
connectPhp.server({}, function (){
browserSync({
proxy: 'localhost:8000',
base: 'dist',
open: {
browser: 'Google Chrome'
}
});
});
});
gulp.task('watch', function() {
gulp.watch(filesPartials, 'pages');
gulp.watch(filesImages, 'images');
gulp.watch(filesSvg, 'svgsprite');
});
// Tasks
gulp.task('default', gulp.series(gulp.parallel('pages', 'images', 'svgsprite'), 'copy', 'connectSync', 'watch'));
```
But when I go to include my partials `{{> file-name}}`, panini only outputs that exactly (not the contents of that file). Can anyone help clarify where I went wrong and how to fix it?
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with the gulp `pages` task and Panini's configured root, layouts, partials, helpers, and data paths; compare them with the project tree and how `{{> file-name}}` is resolved. Run the pages task and inspect the generated page. Done means the partial's contents appear in the output instead of the literal expression.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- handlebars, javascript
- Domain
- build-system, tooling
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100