小编Evg*_*nov的帖子

我有下一个项目结构：

– js
    |-- index.js // the entry point
    |-- components
        |-- FooComponent.js // example component
- less
    |-- app.less // common styles for the entire app (scaffolding, variables) 
    |-- components
        |-- FooComponent.less // styles for a specific component

在index.js 中：import '../less/app.less'– 它工作正常。

在FooComponent.js：import '../../less/components/FooComponent.less'-这是行不通的，因为FooComponent.less取决于变量app.less。

我知道我可以@import "FooComponent.less"在app.less 中。但我觉得有一种方法，以进口app.less在一个地方（index.js），然后导入ComponentName.less在ComponentName.js，还是没有？

webpack.config.js：

module.exports = {
    entry: './app/js/index.js',
    ...
    module: …

我有下一个html/css代码:

.first,
.second {
  width: 200px;
  height: 100px;
  border: 1px solid #333;
  text-align: center;
  display: inline-block
}

.first > ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

<div class="first"><h1>first div</h1><ul><li>text</li></ul></div>
<div class="second"><h1>second div</h1></div>

当我把ul元素放在第一个div中时,为什么第二个div会滑落？

JS Bin链接,以防万一.谢谢!