javascript - Vuejs : Includes css file in webpack minified css

Question

在我的 vuejs 元素中，我想将我的个人 css 文件包含到从 *.vue 文件中的样式生成的缩小的 css 文件中

在 App.vue 中我有:

<style lang="scss">
  @import '/static/css/AdminLTE.min.css';
  @import '/static/css/style.css';
  @import '/static/js/plugins/pace/pace.min.css';
</style>

我使用 ExtractTextPlugin 提取和缩小 *.vue 文件中的样式:

 // extract css into its own file
    new ExtractTextPlugin({
      filename: utils.assetsPath('css/[name].[contenthash].css')
    }),
    // Compress extracted CSS. We are using this plugin so that possible
    // duplicated CSS from different components can be deduped.
    new OptimizeCSSPlugin({
      cssProcessorOptions: {
        safe: true
      }
    }),

所以我的网站是插件中的 app.conbtenthash.css 文件和我导入的三个文件。但是无论如何要在应用程序 css 文件中包含我的三个导入文件吗？

比你还好!

Answer 1

文档:https://vue-loader.vuejs.org/en/configurations/extract-css.html

类似问题: Vue.js + Webpack multiple style tas output | how to extract vue files style into one seperate style.css file

所以你应该在 ExtractTextPlugin 中指定单个文件名

new ExtractTextPlugin("style.css")