使用捆绑js捆绑我的CSS时出错

时间:2018-04-05 08:49:48

标签: javascript jquery css bundling-and-minification

我正在使用捆绑js来最小化我的css文件。但是当我运行ection时出现了一些错误。显示的错误是

  

模块解析失败:意外字符'@'(11:0)   您可能需要适当的加载程序来处理此文件类型。   我尝试了一些解决方案。但是它不起作用..问题在于我的css文件我有@fontface风格。这是我的webpack文件

const path = require('path');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
  mode: 'development',
  entry: {
     csslib : [
     //  './stylesheets/layouts/bootstrap.min.css',

     ],
    css : [
      './stylesheets/layout.css',

    ],
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        include: path.resolve(__dirname, './javascripts/dist/'),
        use: ExtractTextPlugin.extract({
          fallback: "file-loader",
          use:  [ 'css-loader' ,'style-loader'],
          publicPath : path.resolve(__dirname, './public/javascripts/dist/'),
        }),
      },
      {
        test:  /\.eot$|\.jpe?g$|\.gif$|\.png$|\.svg$|\.woff$|\.ttf$|\.wav$|\.mp3$/, 
        loader: "file-loader" ,      
      }
    ]
  },
  plugins: [
    new ExtractTextPlugin('./stylesheets/dist/[name].css'),
  ]
}

这是我的布局css文件

@font-face {
    font-family:'open_sansregular';
    src: url('../../fonts/OpenSans-Regular-webfont.eot');
    src: url('../../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('../../fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('../../fonts/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

任何人都可以帮助我吗?

0 个答案:

没有答案