Vue为何打包后的样式不一致？-灵析社区

有两个组件``和``，代码如下： ``` export default { name: 'Layout', } .header { background: linear-gradient(135deg, #7f7fd5, #86a8e7, #91eae4); height: 100px; display: flex; align-items: center; } ``` ``` Installed CLI Plugins import Layout from './Layout.vue' export default { name: 'HelloWorld', components: { Layout }, } .header { background: rgb(38, 57, 224); height: 200px; } ``` 此时打包后样式应用如下：  第一个`header`使用第一组样式，第二个`header`在继承的基础上覆盖了部分样式 但将`layout`最外一层`div`标签去掉后： ``` ``` 变成 ``` ``` 再次打包，得到的结果是  两个`header`应用相同的样式 请问为什么多了一层`div`标签会造成打包结果不同？