webpack weniger Fehler, es können keine .ttf- und woff2-Dateien von uikit @ aufgelöst werd

Question

Jul 18, 2015, 07:33 PM

webpack weniger Fehler, es können keine .ttf- und woff2-Dateien von uikit @ aufgelöst werd

Ich bin wirklich Neuling mit Webpack, also bin ich mir nicht sicher, ob ich etwas falsch mache. Ich möchte @ verwende uikit und weniger mit webpack habe ich die entsprechenden loader installiert wie url-loader, file-loader, less-loader

und in die Webpack-Konfiguration aufnehmen

loaders: [{
  test: /\.jsx?$/,
  loaders: ['react-hot', 'babel'],
  include: path.join(__dirname, 'scripts')
 },
 {
test: /\.less$/,
loader: 'style!css!less'
},
{
       test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
       loader: "url-loader?limit=10000&minetype=application/font-woff"
 },
{
       test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
       loader: "file-loader"
   },
   {
       test: /\.jpe?g$|\.gif$|\.png$|\.wav$|\.mp3$/,
       loader: "file-loader"
   }
   /*,  <----I ALSO TRY WITH THIS CONFIG....
     { test: /\.woff$/,   loader: "url-loader?prefix=font/&limit=5000&mimetype=application/font-woff" },
     { test: /\.ttf$/,    loader: "file-loader" },
     { test: /\.eot$/,    loader: "file-loader" },
     { test: /\.svg$/,    loader: "file-loader" }*/

]

Ich füge meine less-Datei in den Einstiegspunkt meiner js-Datei ein

 require("!css!less!../less/main.less")

und meine less-Datei sieht aus wie

@ import "../bower_components/uikit/less/uikit.less"

html {Hintergrundfarbe: rot; }

das Verzeichnis

wenn ich versuche, die Konsole auszuführen, zeigt dies:

ERROR in ./~/css-loader!./~/less-loader!./less/main.less
Module not found: Error: Cannot resolve 'file' or 'directory' ../bower_components/uikit/less/fonts/fontawesome-webfont.eot in /home/yo/Downloads/proj/scalaPROJ/activatorPRJ/finatra-seed/react-hot-boilerplate/less
 @ ./~/css-loader!./~/less-loader!./less/main.less 6:77369-77440 6:77463-77534

ERROR in ./~/css-loader!./~/less-loader!./less/main.less
Module not found: Error: Cannot resolve 'file' or 'directory' ../bower_components/uikit/less/fonts/fontawesome-webfont.woff2 in /home/yo/Downloads/proj/scalaPROJ/activatorPRJ/finatra-seed/react-hot-boilerplate/less
 @ ./~/css-loader!./~/less-loader!./less/main.less 6:77586-77659

ERROR in ./~/css-loader!./~/less-loader!./less/main.less
Module not found: Error: Cannot resolve 'file' or 'directory' ../bower_components/uikit/less/fonts/fontawesome-webfont.woff in /home/yo/Downloads/proj/scalaPROJ/activatorPRJ/finatra-seed/react-hot-boilerplate/less
 @ ./~/css-loader!./~/less-loader!./less/main.less 6:77690-77762

ERROR in ./~/css-loader!./~/less-loader!./less/main.less
Module not found: Error: Cannot resolve 'file' or 'directory' ../bower_components/uikit/less/fonts/fontawesome-webfont.ttf in /home/yo/Downloads/proj/scalaPROJ/activatorPRJ/finatra-seed/react-hot-boilerplate/less
 @ ./~/css-loader!./~/less-loader!./less/main.less 6:77794-77865
webpack: bundle is now VALID.

hope die fehler werden für dich viel deutlicher und können mir weiterhelfen, vielen dank

Zu kommentieren