A
A
AstralProj2021-04-05 20:03:10
gulp.js
AstralProj, 2021-04-05 20:03:10

Gulp doesn't create dist folder, how to fix?

All the best! I started to study JS and different libraries, the problem with Gulp, I did everything as in the video instructions, everything turned out there, I don’t have it. files. It does not give any errors:
Windows PowerShell
(C) Microsoft Corporation, 2009. All rights reserved.

PS C:\Users\AzaxSyndrome\Desktop\BigSite> gulp
[19:41:06] Using gulpfile ~\Desktop\BigSite\gulpfile.js
[19:41:06] Starting 'default'...
[19:41: 06] Starting 'browserSync'...
[19:41:06] Starting 'html'...
[19:41:06] Finished 'html' after 35 ms
[Browsersync] Access URLs:
------- ------------------------------
Local:localhost:3000
External: 192.168.1.47:3000
-------------------------------------
UI: localhost :3001
UI External: localhost:3001
-------------------------------------
[Browsersync] Serving files from: ./dist/ I
also set include, I can't include another html(footer,header) in the index.html file, @@includeheader.html is not accessed, it appears in the browser as a simple entry: @@include('./ header.html')

Answer the question

In order to leave comments, you need to log in

2 answer(s)
L
lchsha, 2021-08-07
@lchsha

Most likely you have an error in the name of the variable. In the src and watch object, the source_folder variable should be in the property values ​​instead of the project_folder variable.
src: {
html: source_folder+ "/*.html",
css: source_folder+ "/scss/style.scss",
js: source_folder+ "/js/script.js",
img: source_folder+ "/img/**/*.{ jpg,png,svg,gif,ico,webp}",
fonts: source_folder+ "/fonts/*.ttf",
},
watch: {
html: source_folder+ "/**/*.html",
css: source_folder+ "/scss /**/*.scss",
js: source_folder+ "/js/**/*.js",
img: source_folder+ "/img/**/*.{jpg,png,svg,gif,ico,webp}" ,
},

A
AstralProj, 2021-04-06
@AstralProj

let project_folder = "dist";
let source_folder = "#src";
let path = {
build: {
html: project_folder + "/",
css: project_folder + "/css/",
js: project_folder + "/js/",
img: project_folder + "/img/",
fonts: project_folder + " /fonts/",
},
src: {
html: project_folder + "/*.html",
css: project_folder + "/scss/style.scss",
js: project_folder + "/js/script.js",
img: project_folder + "/img/**/*.{jpg,png,svg,gif,ico,webp}",
fonts: project_folder + "/fonts/*.ttf",
},
watch: {
html: project_folder + "/* */*.html",
js: project_folder + "/js/**/*.js",
img: project_folder + "/img/**/*.{jpg,png,svg,gif,ico,webp}",
},
clean: ". /" + project_folder + "/"
}
let { src, dest } = require("gulp"),
gulp = require("gulp"),
browsersync = require("browser-sync").create();
function browserSync(params) {
browsersync.init({
server: {
baseDir: "./" + project_folder + "/"
},
port: 3000,
notify: false
})
}
function html() {
return src(path.src. html)
.pipe(dest(path.build.html))
.pipe(browsersync.stream())
}
let build = gulp.
let watch = gulp.parallel(build, browserSync);
exports.html = html;
exports.build = build;
exports.watch = watch;
exports.default = watch;

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question