javascript - 什么是标准的预处理/后处理工作流程?

标签 javascript css performance sass gruntjs

<分区>


想要改进这个问题? 更新问题,以便 editing this post 可以用事实和引用来回答它.

关闭 9 年前

什么是更有效的做事方式:

  1. 在您的本地环境中拥有 SASS 文件和单独的 CSS/JS 文件,并在部署后对它们进行编译、连接和压缩。

  2. 在本地构建和编译所有文件,并且仅将编译、连接和缩小的文件推送到实时。

我认为从性能的 Angular 来看 #2 更有意义,但对于有多位开发人员从事同一件事的元素而言,它的可维护性较差。

这个问题有没有通用的解决方案?

最佳答案

我将源代码(如 SASS、CoffeeScript)和编译/缩小版本保存在同一个存储库中。

每当我处理它时,我都会打开一个或多个进程来查找文件中的更改并启动相关的编译过程。这样一来,每当我在浏览器上测试更改时,它就会加载最终的编译/缩小版本。在浏览器上点击保存和点击重新加载之间我确实需要等待 1 或 2 秒,但恕我直言,我在下面解释的好处抵消了这个缺点。

每当我进行提交时,它包括对源代码和相关编译/缩小版本的更改。

这为我解决了所有问题,包括:

  1. 所有测试都在最终编译版本上完成,即使在开发期间也是如此,而不是在一些不同的、半生不熟的版本上。这对于潜在的破坏性操作尤其重要,例如 Google Closure Compiler Advanced Compilation。 (事实上​​,正是这种开发策略让我首先使用了 Advanced Compilation。)

  2. 在演示/测试/生产服务器上部署不需要编译步骤,这可能需要与这些服务器上可用的工具和版本不同的工具和版本。

这只是我的经验。它可能需要在非常大的元素上进行更改,但对于中小型元素来说它工作得很好。

关于javascript - 什么是标准的预处理/后处理工作流程?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21556554/

上一篇:css - 带 child 指示器的垂直下拉菜单

下一篇:javascript - 获取按钮的计算样式或默认样式并在新元素上设置

相关文章:

javascript - XUL 获取通知框

css - 在流体容器中垂直居中文本

python - 实参校验性能影响

javascript - 使用 querySelectorAll 获取元素

javascript - 如何连接两个 JavaScript 变量和正则表达式

css - 是否有 CSS 父级选择器?

css - 为什么我的 p 标签不在我的两个内容 div 中居中

php - 在数据库服务器上存储大量表

c# - 立即显示启动画面

javascript - JavaScript 中的多个箭头函数是什么意思?