使用Foundation 6 for Email时Sass异常，npm run build执行失败

你遇到的是gulp-uncss插件抛出的类型错误，核心问题是插件收到了空字符串作为"file"参数，导致构建中断。先把你的报错信息贴出来方便定位：

[02:42:06] Failed to load external module @babel/register 
[02:42:06] Requiring external module babel-register 
[02:42:08] Using gulpfile ~/IdeaProjects/edm/gulpfile.babel.js 
[02:42:08] Starting 'default'... 
[02:42:08] Starting 'build'... 
[02:42:08] Starting 'clean'... 
[02:42:08] Finished 'clean' after 5.29 ms 
[02:42:08] Starting 'pages'... 
[02:42:09] Finished 'pages' after 380 ms 
[02:42:09] Starting 'sass'... 
[02:42:09] 'sass' errored after 339 ms 
[02:42:09] TypeError in plugin 'gulp-uncss' 
Message: "file" argument must be a non-empty string 
Details: domainEmitter: [object Object] domain: [object Object] domainThrown: false 
[02:42:09] 'build' errored after 726 ms 
[02:42:09] 'default' errored after 728 ms 
npm ERR! code ELIFECYCLE 
npm ERR! errno 1 
npm ERR! foundation-emails-template@1.0.0 build: `gulp --production` 
npm ERR! Exit status 1 
npm ERR! 
npm ERR! Failed at the foundation-emails-template@1.0.0 build script. 
npm ERR! This is probably not a problem with npm. There is likely additional logging output above. 
npm ERR! A complete log of this run can be found in: 
npm ERR! /Users/baixu/.npm/_logs/2018-05-14T18_42_09_404Z-debug.log

可能的原因 #

• 无效的页面文件：src/pages目录下存在空HTML文件，或者文件名/路径包含特殊字符，导致gulp-uncss无法读取有效文件路径。
• UnCSS配置错误：gulpfile.babel.js中uncss任务的HTML文件路径配置错误，指向了不存在的文件或空路径。
• 依赖版本冲突：gulp-uncss与Foundation Emails模板的其他依赖（如uncss核心库、gulp）版本不兼容，导致参数处理异常。

解决办法 #

1. 检查页面文件有效性 #

• 打开src/pages目录，删除所有空的HTML文件，确保每个页面都有完整的HTML结构。
• 检查文件名：避免使用中文、空格或特殊字符，改用英文小写+短横线的命名方式（比如welcome-email.html）。

2. 修正UnCSS路径配置 #

打开gulpfile.babel.js，找到包含gulp-uncss的任务段（通常在sass任务里），确认html参数指向的是正确的输出路径。正确的配置应该类似：

.pipe(uncss({
  html: ['dist/pages/*.html']
}))

如果路径写错了（比如写成了src/pages/*.html或者错误的路径），改成构建后生成的HTML文件路径（默认是dist/pages/下的所有HTML）。

3. 清理并重新安装依赖 #

依赖缓存或版本冲突是常见问题，执行以下步骤重置依赖：

# 删除node_modules和锁文件
rm -rf node_modules package-lock.json
# 重新安装依赖
npm install

完成后再次运行npm run build试试。

4. 指定兼容的UnCSS版本 #

如果是版本兼容问题，可以在package.json中指定一个稳定兼容的gulp-uncss版本，比如：

"devDependencies": {
  // 其他依赖...
  "gulp-uncss": "^1.0.6"
}

然后执行npm install更新依赖，再尝试构建。

内容的提问来源于stack exchange，提问作者user9790273