Pattern Lab "not mix well" 和 Angular 一起吗？
Does Pattern Lab "not mix well" with Angular?
作为一名寻找更好的方式与开发人员合作的交互设计师，我尝试向我当前的客户介绍 Pattern Lab。然而，前端框架的首席开发人员反对。他论点的要点：
Our toolkit has complex components that require JavaScript or a JS library in addition to HTML/CSS. This would not mix well with the Mustache or Handlebars templating in the Pattern Lab. Thus we use Angular JS, which is the framework that our components are written in.
我试图寻找讨论此主题的文章。两年前有nothing here on SO as far as I can tell. Outside SO I have found just a few posts (example), but nothing that's specifically on the topic of Pattern Lab's (lack of) compatibility with Angular, except for a parsing issue that was solved
作为一名非程序员，我没有必要的影响力来影响我的开发同行。如果有亲身体验过的能详细说一下就好了
这里是模式实验室节点的维护者。
我刚刚在 Pattern Lab 中创建了这个简化示例存储库来说明 Angular。
存储库 https://github.com/bmuenzenmeyer/patternlab-node-angular-example
现场演示 http://www.brianmuenzenmeyer.com/patternlab-node-angular-example/public/index.html
如您所见，Pattern Lab 可以在单个模式的范围内 运行 任意前端代码，包括 Javascript，因此有动力的个人可以展示使用它的组件。
就是说，我不认为 PL 的 "with the grain" 构建原子组件的方法与 Angular 完美配合（例如，不要在这里构建整个应用程序）但展示 JS例如，在工具提示或模态组件后面，可以单独使用。
这个策略类似于让我想起 https://rizzo.lonelyplanet.com/styleguide/design-elements/ - 其中他们有 UI 个组件和 JS 组件。
希望这有助于消除任何困惑。
使用 Pattern Lab 创建的可重用模式 绝不 依赖于 Mustache，因此您的开发人员可以放心，Pattern Lab 不会引入任何会转移到他们的代码中的依赖项.
事实上，无论是否使用 Pattern Lab 构建的样式指南的全部意义在于构建一个独立于语言的样式模式库——HTML 标记和 CSS——开发人员可以在他们的应用程序中重复使用，无论他们选择在 AngularJS、ReactJS、简单的旧服务器端代码背后还是其他东西中构建它们。
Pattern lab 只是维护样式指南的前端开发人员或设计人员的一个方便工具。它生成一个展示不同模式的静态风格指南网站。该网站将成为项目开发人员使用这些模式的工具。正如AngularJS可以用在任何静态站点中一样，它当然也可以用在使用Pattern Lab生成的静态站点中。
Mustache 是 Pattern Lab 用于生成静态网站的工具堆栈的一部分，但没有 Mustache 的痕迹或对它的依赖性会转移到生成的网站上。我为几个 AngularJS 团队提供托管在 Pattern Lab 上的设计模式，其中 none 曾经不得不接触甚至了解 Mustache。
如果您的开发人员熟悉 Bootstrap 或 Foundation 等前端框架，它们为不同的前端块提供了文档化的模式，这也是一样的。不同项目的开发人员可以复制 HTML 标记和 CSS 代码，而无需任何其他依赖项。
风格指南应该是任何现代 Web 开发设置的先决条件，因为它是开发人员和设计人员之间智能高效协作的先决条件，并且可以更快地制作快速原型。所以我认为你应该讨论的是你是否应该使用风格指南来协作并帮助更有效的协作。如果您就此达成一致，Pattern Lab 就是开发它的明智选择。
这里很好地介绍了如何使用风格指南，以及您可以用来构建风格指南的不同工具集。模式实验室列在样式指南平台部分下：
https://www.smashingmagazine.com/2015/04/an-in-depth-overview-of-living-style-guide-tools/
希望这可以引发与您的开发人员更好的讨论，如果他们阻止您构建样式指南，他们就会错过。
我们已经成功地将 Pattern Lab 构建到我们的开发工作流程中。我们只是调整了 patternlab 构建以将生成的 CSS 文件复制到我们应用程序的资产文件夹中。开发人员在 Pattern Lab 中编写所有 CSS 和模板，生成的文件会自动在应用程序中使用。
作为一名寻找更好的方式与开发人员合作的交互设计师，我尝试向我当前的客户介绍 Pattern Lab。然而，前端框架的首席开发人员反对。他论点的要点：
Our toolkit has complex components that require JavaScript or a JS library in addition to HTML/CSS. This would not mix well with the Mustache or Handlebars templating in the Pattern Lab. Thus we use Angular JS, which is the framework that our components are written in.
我试图寻找讨论此主题的文章。两年前有nothing here on SO as far as I can tell. Outside SO I have found just a few posts (example), but nothing that's specifically on the topic of Pattern Lab's (lack of) compatibility with Angular, except for a parsing issue that was solved
作为一名非程序员，我没有必要的影响力来影响我的开发同行。如果有亲身体验过的能详细说一下就好了
这里是模式实验室节点的维护者。
我刚刚在 Pattern Lab 中创建了这个简化示例存储库来说明 Angular。
存储库 https://github.com/bmuenzenmeyer/patternlab-node-angular-example
现场演示 http://www.brianmuenzenmeyer.com/patternlab-node-angular-example/public/index.html
如您所见，Pattern Lab 可以在单个模式的范围内 运行 任意前端代码，包括 Javascript，因此有动力的个人可以展示使用它的组件。
就是说，我不认为 PL 的 "with the grain" 构建原子组件的方法与 Angular 完美配合（例如，不要在这里构建整个应用程序）但展示 JS例如，在工具提示或模态组件后面，可以单独使用。
这个策略类似于让我想起 https://rizzo.lonelyplanet.com/styleguide/design-elements/ - 其中他们有 UI 个组件和 JS 组件。
希望这有助于消除任何困惑。
使用 Pattern Lab 创建的可重用模式 绝不 依赖于 Mustache，因此您的开发人员可以放心，Pattern Lab 不会引入任何会转移到他们的代码中的依赖项.
事实上，无论是否使用 Pattern Lab 构建的样式指南的全部意义在于构建一个独立于语言的样式模式库——HTML 标记和 CSS——开发人员可以在他们的应用程序中重复使用，无论他们选择在 AngularJS、ReactJS、简单的旧服务器端代码背后还是其他东西中构建它们。
Pattern lab 只是维护样式指南的前端开发人员或设计人员的一个方便工具。它生成一个展示不同模式的静态风格指南网站。该网站将成为项目开发人员使用这些模式的工具。正如AngularJS可以用在任何静态站点中一样，它当然也可以用在使用Pattern Lab生成的静态站点中。
Mustache 是 Pattern Lab 用于生成静态网站的工具堆栈的一部分，但没有 Mustache 的痕迹或对它的依赖性会转移到生成的网站上。我为几个 AngularJS 团队提供托管在 Pattern Lab 上的设计模式，其中 none 曾经不得不接触甚至了解 Mustache。
如果您的开发人员熟悉 Bootstrap 或 Foundation 等前端框架，它们为不同的前端块提供了文档化的模式，这也是一样的。不同项目的开发人员可以复制 HTML 标记和 CSS 代码，而无需任何其他依赖项。
风格指南应该是任何现代 Web 开发设置的先决条件，因为它是开发人员和设计人员之间智能高效协作的先决条件，并且可以更快地制作快速原型。所以我认为你应该讨论的是你是否应该使用风格指南来协作并帮助更有效的协作。如果您就此达成一致，Pattern Lab 就是开发它的明智选择。
这里很好地介绍了如何使用风格指南，以及您可以用来构建风格指南的不同工具集。模式实验室列在样式指南平台部分下： https://www.smashingmagazine.com/2015/04/an-in-depth-overview-of-living-style-guide-tools/
希望这可以引发与您的开发人员更好的讨论，如果他们阻止您构建样式指南，他们就会错过。
我们已经成功地将 Pattern Lab 构建到我们的开发工作流程中。我们只是调整了 patternlab 构建以将生成的 CSS 文件复制到我们应用程序的资产文件夹中。开发人员在 Pattern Lab 中编写所有 CSS 和模板，生成的文件会自动在应用程序中使用。