Javascript 在网页包上重新创建gulp配置

现在我真的需要帮助来理解webpack，虽然我做了很多尝试，但我仍然不明白如何将webpack用作任务运行程序，而不仅仅是模块绑定器。这是一个学习过程，所以请不要讨论为什么gulp/webpack在这类工作中比其他工作更好

您可以看到，代码实际上非常简单，其思想是基于一个模板对每个htmlfile进行爬网，该模板注入了来自css和js的同名变量。这个gulpfile是我用来创建polymerjshtml文件的

有没有办法把它转换成特定于网页包的构建工具？我应该把信息放在哪里，以便在网页包中对文件夹进行爬网？我应该把它放到index.js中吗

我理解为Webpack使用特定条目文件的概念，但是当面对这种用例时，我应该怎么做

gulp.task('templates', function() {
// crawl folder pathToFolder
    readdir(pathToFolder, ['*.scss', '*.js', '*.json'], function(err, files) {
        // loop every file founds
        files.forEach(function(file) {
            let data = file.substr(10);
            // make sure the path is correct when used on windows device.
            data = data.replace(String.fromCharCode(92), String.fromCharCode(47));
            let index = data.lastIndexOf('/');
            let path = data.substr(0, index);
            let scss = file.substr(0, file.lastIndexOf('.')) + '.scss';
            let js = file.substr(0, file.lastIndexOf('.')) + '.js';
            let json = file.substr(0, file.lastIndexOf('.')) + '.json';
            // process all files into their respective loader and squash it into one variable to use on the template.
            let process = {
                css: '',
                form: '',
                js: '',
                json: '',
            };
            if (fs.existsSync(scss)) {
                process = Object.assign(process, {
                    css: sass.compiler.renderSync({
                        file: scss,
                    }).css,
                });
            }
            if (fs.existsSync(js)) {
                process = Object.assign(process, {
                    js: fs.readFileSync(js, 'utf8'),
                });
            }
            if (fs.existsSync(json)) {
                let x = gulp.src('./ramen-renderer.html')
                    .pipe(template({
                        json: json,
                    }));
                process = Object.assign(process, {
                    json: x,
                });
                // jsonProcess = Object.assign(jsonProcess, {json: fs.readFileSync(json, "utf8")});
            }
            // render the final html path with gulp-template
            return gulp.src(file)
                .pipe(template(process))
                .pipe(gulp.dest('src/' + path));
        });
    });
});

---

webpack不是任务运行程序，而是模块绑定器。这意味着您需要另一种方式来运行任务。最常见的方法是使用NPM实现这一点。您可以在脚本部分的package.json中定义任务

对于操作系统不可知的路径操作，请使用模块而不是这些字符串替换。