Question

导入共享主题作为我的某个组件的一部分时，我遇到了一些错误。这是示例共享主题文件

<dom-module id="shared-theme">
  <template>
    <style>
      .header {
        background: url('repeatable.png') center/contain repeat;
    </style>
  </template>
</dom-module>

我得到的错误是使用url（''）...

ERROR in .repeatable.png
Module parse failed: /node_modules/image-webpack-loader/index.js!/repeatable.png 
Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type.

我将使用哪种类型的装载机？如果我使用文件加载器，它会在缺少Polymer的程序中产生错误。

Answer 1

我明白了。抱歉打扰了。但答案只是添加file-loader / image-webpack-loader

module: {
    rules: [
      {
        // If you see a file that ends in .html, send it to these loaders.
        test: /\.html$/,
        // This is an example of chained loaders in Webpack.
        // Chained loaders run last to first. So it will run
        // polymer-webpack-loader, and hand the output to
        // babel-loader. This let's us transpile JS in our `<script>` elements.
        use: [
          { loader: 'babel-loader' },
          { loader: 'polymer-webpack-loader' }
        ]
      },
      {
        // If you see a file that ends in .js, just send it to the babel-loader.
        test: /\.js$/,
        use: 'babel-loader'
      },
      {
        test: /\.(gif|png|jpe?g|svg)$/i,
        use: [
          { loader: 'file-loader' },
          { loader: 'image-webpack-loader' }
        ]
      }
    ]
  }

polymer-webpack-loader在使用（url）加载共享样式时出错

1 个答案: