1

プロジェクトでGoogle の Material Components for Webを使用しようとしています。問題は、npm によると、インポート ステートメントを追加すると、webpack は何も出力せず、コードで終了することです。3221226505

これが私のApp.vueのスニペットです:

import 'material-components-web/dist/material-components-web.min.css';

プロジェクトのコミット ツリーはここにあります。興味深いものが含まれている場合に備えて、npm ログはここにあります。

誰かがこの問題で私を助けてくれることを願っています。私のレポで他に型にはまらないものを見つけた場合は、お知らせください。ありがとうございました！

4

2 に答える 2

0

css ファイルのローダーを定義するのを忘れていたことが判明しました。なぜwebpackがエラーコードで終了するのかまだ疑問に思っていますが...

ただし、ここに私の更新済みの一部がありますwebpack.config.js。 module.exports.module.rulesこれが含まれるようになりました：

{
  test: /\.css$/,
  use: ['style-loader', 'css-loader']
}
于 2016-12-23T13:21:32.953 に答える
0

CSS のインポートに使用している構文が間違っています。ドキュメントに記載されているように、index.html で次のようにする必要があります。

 <link rel="stylesheet"
          href="node_modules/material-components-web/dist/material-components-web.css">

ただしnode_modules、webpack を使用しているためアクセスできません。このファイルを静的フォルダーに移動して、次のようにインポートできます。

<link rel="stylesheet" href="/static/material-components-web.css" type="text/css">

以下はドキュメントからの完全なコードです:

<!DOCTYPE html>
<html class="mdc-typography">
  <head>
    <title>Material Components for the web</title>
    <link rel="stylesheet" href="/static/material-components-web.css" type="text/css">
  </head>
  <body>
    //HTML where you use material components
    <script src="/static/material-components-web.js"></script>
    <script>mdc.autoInit()</script>
  </body>
</html>
于 2016-12-23T13:15:35.670 に答える