webpack打包遇到的一些问题

webpack打包后背景图片未正常引入路径

const target = "bundles";
const extractTextPlugin = new ExtractTextPlugin({
  filename: path.join("", "[name].[contenthash].css")  //前设置为空,引入的路径便不会引入bundles
});

配置路径需要注意输出路径和输入路径的配置是否一致

webpack打包后z-index设置无效默认为1

new OptimizeCssAssetsPlugin({
      cssProcessor: require("cssnano"),
      cssProcessorOptions: {
        discardComments: {
          removeAll: true
        },
        safe: true  //设置为安全,避免cssnano重新计算
      },
      canPrint: true
    })

cssnano 将 z-index归类为 unsafe，而不是 bug，只有在单个网页的 css 全部写入一个 css 文件，并且不通过 JavaScript 进行改动时是 safe。

last-child设置无效

我感觉犯了低级错误,不过还是记录一下吧,防止再犯
我开始是这么设计的

      <div>
        <div class="item">11</div>
        <div class="item">11</div>
        <div class="item">11</div>
        <div class="last"></div>
      </div>

而在使用的时候使用item.last-child{xxx},无效果
解决方式呢

 <div class="wrap">
      <div>
        <div class="item">11</div>
        <div class="item">11</div>
        <div class="item">11</div>
      </div>
      <div class="last"></div>
 </div>

因为wrap包裹的不仅仅只有.item,还有.last,而item.last-child是在同一个父级的作用下,这样不同的在一个父级下就无法找到,所以需要把.item包裹一个父级