在 Electron 应用程序中使用 Foundation

Question

我正在创建一个新的 Electron 应用程序，我想将 Foundation 用于应用程序并 SASS 使用它。问题是 Foundation 希望我创建一个新项目，而我宁愿通过 npm 添加 Foundation 我的 electron，甚至在必要时使用 bower。

最好的方法是什么？

我已经成功地尝试将 Foundation-sites 作为 npm 依赖项添加到我的 Electron 应用程序的 package.json 中，但我不确定从那里可以做什么。是否还有 Foundation for apps 替代 Foundation-sites npm 包？

Answer 1

第一步是将 Foundation 添加到您的项目中：

npm install foundation-sites --save

这为您提供 node_modules/foundation-sites/scss/.

中的基础 Sass (SCSS) 个文件

假设您在 scss/app.scss 中有项目特定的 SCSS，然后您需要导入 Foundation SCSS，例如：

@import 'node_modules/foundation-sites/scss/foundation.scss';

@include foundation-everything

您的构建过程需要从这些 Sass 文件生成 CSS - 这可以通过各种工具完成，例如 Gulp、Webpack、Grunt 或简单的 npm 脚本。然后只需将 CSS 包含在 HTML 文件中。

Foundation 文档确实在 Sass 下使用 Grunt 示例介绍了这一点，但我花了一段时间才找到它，因为它没有从安装说明链接到。

如果您更喜欢使用 Foundation for Apps，这些说明可以很容易地适用于 foundation-apps 包。

Using Foundation in an Electron app