HTML组件开发。浏览器自动重新加载，轻量级，快速解决方案

Question

让我们说我想创建一个由HTML组件组成的新框架。 我的项目结构是这样的：

/components
../dialog
../../css
../../js
../../html
../textfield
../../css
../../js
../../html

我需要一些技术来运行这样的项目，它会给我：

• 即时浏览器重新加载/热代码推送
• less / sass support
• 模板引擎就像把手一样，因此对于每个组件，我都不需要导入我的所有CSS并编写html head标签

所以基本上我需要像codepen.io这样的东西，但是我的IDE（我使用webstorm）的力量

我尝试了什么：

• ExpressJs - 我不喜欢我应该为每个组件定义路由，但仍然无法使用任何热推包配置它：nodemon，node-supervisor - 他们重新加载应用程序，但没有重新加载页面。
• Ember - 需要并生成大量temp代码，导致我的8gb ram计算机运行缓慢，因为我的IDE尝试索引所有node_modules。我知道它可以配置，但也没有其他优点。
• Angular - 在创建新的组件文件后我还应该做很多步骤 - 导入等。
• Meteor - 目前为止最好的解决方案之一，但它拥有完整的技术堆栈 - client＆amp; server。重新加载有点慢。我知道exactly它不能与Chrome开发工具工作区一起使用，可以立即从控制台编辑css并保存到磁盘，这是我梦寐以求的功能。

避免任何混淆。因此我想为用户提供css / less / sass和html / jade / ... 它不应该像Web组件：Polymer或React

Answer 1

您可以在Facebook上试用React。它是一个仅生成View的客户端框架。

• 结合webpack和webpack-dev-server，您可以将热门代码推送到您的网页。
• 结合less-loader或sass-loader，您可以获得LESS / SASS支持。
• 结合babel-loader，您可以运行JSX for templates，这是一个类似HTML的标记。还允许您通过转换使用新的ES6功能。

Answer 2

尝试使用BrowserSync编译你的sass gulp。在编译，何时编译等方面提供了大量的自定义。