如何解决使用gulp脚本缩小js
因此由于某种原因,我的gulp脚本遇到了一些问题,其中gulp scripts
无法将适当的js写入捆绑的文件中。
所以我有以下文件夹结构:
theme/
- dist/
--- css/
----- bundle.css
--- js
----- bundle.js
- src/
--- scss/
----- bundle.scss
--- js/
----- bundle.js
----- components/
------- test.js
这是gulp styles
任务的完美表现-它的作用是将src/scss/
内的所有内容都打包并捆绑并将其导出到dist/css/bundle.css
。
export const styles = () => {
return src(['src/scss/bundle.scss','src/scss/admin.scss','src/scss/bulmapress.scss'])
.pipe(sourcemaps.init())
.pipe(sass().on('error',sass.logError))
.pipe(cleanCss({compatibility:'ie8'})
.pipe(dest('dist/css'))
.pipe(server.stream());
}
我的src/scss/bundle.scss
文件具有以下内容:
@import "components/header";
@import "components/footer";
这是我为gulp scripts
所拥有的任务,在该任务中,一旦我运行该任务,它就不会编译src/js/components
等内部的内容。它只是定义src/js/bundle.js
的存储组件。这是任务:
import "components/test"
我不确定自己在做什么错,还是这是自然行为?有什么更好的选择呢?以下是完整的export const scripts = () => {
return src(['src/js/bundle.js'])
.pipe(dest('dist/js'));
}
(如果有人想签出)。
最好不要将js捆绑到gulpfile.babel.js
中,而应将其最小化到它自己的单独文件中?
bundle.js
解决方法
在进行丑化或缩小之前,必须使用gulp-babel将ES6代码转换为ES5代码。
阅读有关gulp任务的本文,以了解gulp的工作原理: https://medium.com/@sudoanushil/how-to-write-gulp-tasks-ce1b1b7a7e81
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。