gulp 相关问题

Gulp是一个JavaScript构建系统，基于Node.js的任务运行器，如Grunt。 Gulp使用流和代码配置来实现更简单，更直观的构建过程。

错误 [ERR_REQUIRE_ESM]：gulpfile.js 中 ES 模块的 require()

我有一个React16项目，我正在尝试将其更新到React18，使用旧包一切正常。但我更新了所有包和依赖项，当我想运行它时，它返回此错误： ...

webpack gulp

回答 1 投票 0

问题我有很多 .php 文件，主要包含 HTML，但顶部也有一些 PHP 行（例如表单触发代码或类似代码）。所以他们看起来像问题我有很多 .php 文件，大部分包含 HTML，但顶部也有一些 PHP 行（例如表单触发代码或类似代码）。所以他们看起来像 <?php if($someValue){ //doSth } //more content ?> <!DOCTYPE html> <html lang="de"> <head> <title>My Website</title> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body>  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> </body> </html> 目标我的目标是缩小 HTML（甚至可能是内联 JavaScript，但这只是一点额外的），而不触及顶部的 PHP。我使用 Gulp 作为自动构建工具，并希望看到使用此工具和任何需要的额外包的解决方案。 gulp-htmlmin模块使用html-minifier模块，该模块有很多可用的选项（显示在其npmjs.com和github页面上）。我们重点关注的选项是ignoreCustomFragments。 var gulp = require(gulp), htmlmin = require(gulp-htmlmin); gulp.task('htmltask', function(){ return gulp.src(['./dev/*.html','./dev/*.php']) .pipe(htmlmin({ collapseWhitespace: true, ignoreCustomFragments: [ /<%[\s\S]*?%>/, /<\?[=|php]?[\s\S]*?\?>/ ] })) .pipe(gulp.dest('./site')); }); 在上面的代码中，您会看到我们将 ignoreCustomFragments 与正则表达式 /<\?[=|php]?[\s\S]*?\?>/ 一起使用来忽略以 <? 和 <?php 开头并以 ?> 结尾的代码。默认情况下，html-minifier会忽略php，因此您不必担心设置ignoreCustomFragments。编辑谢谢阿默斯克您使用的某些 php 文件可能没有结束标签，例如许多 WordPress 文件就没有。另一种选择是使用以下内容： ignoreCustomFragments: [/<\?[\s\S]*?(?:\?>|$)/] 您可以使用此 VSCode 扩展：Minify HTML in PHP 这对我有用！ // Gulp.js configuration var // modules gulp = require('gulp'), newer = require('gulp-newer'), htmlmin = require('gulp-htmlmin') // development mode? devBuild = (process.env.NODE_ENV !== 'production'), // folders folder = { src: 'src/', build: 'build/' } gulp.task('minify', () => { return gulp.src('src/*.html') .pipe(htmlmin({ collapseWhitespace: true })) .pipe(gulp.dest('dist')); }); ;

javascript php html gulp minify

回答 3 投票 0

Tailwind 与 php 文件

我我有一个由css、js、php文件组成的项目。 CSS 和 js 文件位于 /src 文件夹中，而 php 文件则位于项目的根文件夹中。我想用顺风和吞咽...

javascript php gulp tailwind-css

回答 1 投票 0

如何从以前的typescript(.ts)文件中删除已编译的JS文件？

我正在关注 Angular 2 快速入门教程。以下是我的文件夹结构 - ├── gulpfile.js ├──index.html ├── js | ├── app.component.js | └── boot.js ├── 来源 | ├── 应用程序.组件.t...

javascript typescript gulp angular

回答 12 投票 0

插件“gulp-file-include”中出现错误消息：JSON5：无效字符' ' 在 1:66

我一直在顺利地使用 gulp，直到任务运行程序开始在 VS Code 终端中显示以下错误： VS Code 终端中显示错误我该如何修复这个错误？

gulp

回答 2 投票 0

需要了解gulp

我收到对象预期的 gulp 错误，但找到了将文件重命名为 gulfile.js 的解决方案需要了解每个项目只有一个 gulp 文件，即 gulpfile.js？如果我需要定义多个

gulp

回答 1 投票 0

WordPress + Gulp - browserSync 不会更新我的 .php 文件

SCSS 和 JS 文件像以前一样工作，但是当我保存 .php 文件时，它会重新加载浏览器，但不会更新 html。这是我的 gulpfile.js 我尝试过分离手表功能并尝试添加一些延迟，但是......

php html wordpress gulp

回答 1 投票 0

Gulp - 从 HTML 文件中删除源映射注释字符串

我生成了 css 文件的副本，将副本的扩展名从 .css 更改为 .html，并添加了元素来环绕 css 规则。以下是结果...我知道...</desc> <question vote="0"> <p>我生成了 css 文件的副本，将副本的扩展名从 <pre><code>.css</code></pre> 更改为 <pre><code>.html</code></pre>，并添加了 <pre><code><style></code></pre> 元素来环绕 css 规则。以下是结果...我知道这一切听起来不合理，但这是我针对特定 Google 应用程序所需的“有意”格式。</p> <p>以下是复制的文件，现在是一个名为 page-css.html 的 HTML 文件</p> <pre><code><style> html body { border: solid 1rem blue; } html body .form-row { margin-bottom: 15px; } /*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInBhZ2UtY3NzLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0k7RUFDSTs7QUFFQTtFQUNJIiwiZmlsZSI6InBhZ2UtY3NzLmNzcyIsInNvdXJjZXNDb250ZW50IjpbImh0bWwge1xyXG4gICAgYm9keSB7XHJcbiAgICAgICAgYm9yZGVyOiBzb2xpZCAxcmVtIGJsdWU7XHJcblxyXG4gICAgICAgIC5mb3JtLXJvdyB7XHJcbiAgICAgICAgICAgIG1hcmdpbi1ib3R0b206IDE1cHg7XHJcbiAgICAgICAgfVxyXG4gICAgfVxyXG59Il19 */ </style> </code></pre> <p>如何使用 Gulp 从该文件中删除整个源映射字符串以使其消失？</p> <p>我已经尝试过...</p> <ul> <li>gulp-decomment</li> <li>吞咽字符串替换</li> <li>吞下条评论</li> </ul> <p>都以相似的方式...</p> <pre><code> const htmlmin = require('gulp-htmlmin'); const decomment = require('gulp-decomment'); const replace = require('gulp-string-replace'); const strip = require('gulp-strip-comments'); ... //example 1 .pipe(decomment({trim: true})) //example 2 .pipe(htmlmin({ removeComments: true })) //example 3 .pipe(strip()) </code></pre> <p>...但是这些包都不能用于替换/删除整个源映射行...</p> <p>我考虑过使用 <pre><code>gulp-string-replace</code></pre> 但我找不到任何关于如何删除特殊字符及其之间的任何内容的学习点。（例如<pre><code>/*#, *, */, ' '</code></pre>）。</p> <p>下面是我尝试通过 gulp 来完成这个过程。但即使使用 <pre><code>gulp-replace</code></pre> （如下<pre><code>greplace</code></pre>），它也不会删除源映射行...</p> <h3>完整的 Gulp 代码示例</h3> <pre><code> function genCSS(done) { return ( src(paths.styles.src) .pipe(gulpif(!GPREP, sourcemaps.init({}))) .pipe(sass().on("error", sass.logError)) .pipe( gulpif( !GPREP, sourcemaps.write({ addComment: true, }) ) ) //CSS FILE WITH ITS SOURCEMAP IS READY FOR LOCAL DEV PURPOSES .pipe(dest(paths.styles.dest)) //BEGIN THE COPIED/CONVERTED HTML FILE FOR GOOGLE APP PURPOSES .pipe( rename(function (path) { if (path.basename === "page-css") { path.extname = ".html"; } }) ) .pipe(header("<style>\n")) .pipe(footer("</style>\n")) //ATTEMPTING TO REMOVE THE SOURCEMAP - BUT IT DOES NOT WORK... .pipe(greplace(/\/\*# sourceMappingURL[^\n]+\n/gm,'')) //STORE THE FILE IN A CLASP LOCATION TO PUSH UP TO GOOGLE .pipe(dest(paths.styles.apps)) .pipe(msync.stream()) ); done(); } </code></pre> <p>非常感谢这个学习过程！</p> </question> <answer tick="false" vote="0"> <p>如果您确信格式一致，可以使用 <a href="https://github.com/lazd/gulp-replace" rel="nofollow noreferrer">gulp-replace</a> 和 RegEx。</p> <pre><code>const replace = require('gulp-replace') ... .pipe(replace(/\/\*# sourceMappingURL[^\n]+\n/gm,'')) ... </code></pre> </answer> </body></html>

gulp

回答 0 投票 0

某些项目中缺少 PhpStorm Npm 和 Gulp 工具窗口

对于所有项目，我在项目的根目录中都有 gulpfile.js （还有 Bower.json、package.json 和 node_modules）。在 PhpStorm 设置 > 语言和框架 > Node.js 和 NPM 中，我可以看到所有（lo...

npm gulp phpstorm

回答 2 投票 0

如何在gulp中运行bash命令？

我想在 gulp.watch 函数末尾添加一些 bash 命令来加快我的开发速度。所以，我想知道是否可能。谢谢！

bash gulp

回答 3 投票 0

从子模板传递 Pug 变量以在父模板块中使用

我正在开发一个使用 Pug 模板引擎的项目。我的所有 Pug 文件（layout.pug、head.pug、index.pug 等）都存储在名为 pug 的文件夹中。在我的layout.pug 文件中，我已经建立了...