簡體   English   中英

webpack沒有加載我的字體文件

[英]webpack not loading my font files

正如之前許多其他人所發生的那樣,webpack根本就沒有將任何字體加載到構建中。 我看了看板,搜索谷歌,嘗試了許多不同的正則表達技巧,並嘗試了其他技術,如來自npm的copy-webpack-plugin。 構建通過通用的'npm start'運行。 請查看下面的目錄結構和我的webpack構建文件,並告訴我可能缺少的內容。 謝謝:-P

目錄結構(CAPS中的文件夾):

/
 - index.html
 - index.js
 - webpack.config.js
 - server.js
 ASSETS
  FONTS
   <font files>
 COMPONENTS
 CONTAINERS, etc..

我的webpack文件(測試底部的字體):

var path = require('path')
var webpack = require('webpack')
var CopyWebpackPlugin = require('copy-webpack-plugin')

module.exports = {
  devtool: 'cheap-module-eval-source-map',
  entry: [
    'eventsource-polyfill',
    'whatwg-fetch',
    'webpack-hot-middleware/client',
    './index'
  ],
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'bundle.js',
    publicPath: '/static/'
  },
  plugins: [
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
  ],
  module: {
    loaders: [{
      test: /\.js$/,
      loaders: [ 'react-hot', 'babel' ],
      exclude: /node_modules/,
      include: __dirname
    }, {
      test: /\.css?$/,
      loaders: [ 'style', 'raw' ],
      include: __dirname
    },
      {
        test: /\.less$/,
        loaders: ['style', 'css', 'less'],
        include: __dirname
      },
      { 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" }]
  }
}

我從來不需要測試中的所有正則表達式。

我的一個webpack文件的示例:

module: {
loaders: [
    // Javascript
    { test: /\.jsx?$/, loader: 'babel', exclude: /node_modules/ },
    // Stylesheets
    { test: /\.scss$/, loader: ExtractTextPlugin.extract('style', 'css?sourceMap!sass?sourceMap') },
    // Font Definitions
    { test: /\.svg$/, loader: 'url?limit=65000&mimetype=image/svg+xml&name=public/fonts/[name].[ext]' },
    { test: /\.woff$/, loader: 'url?limit=65000&mimetype=application/font-woff&name=public/fonts/[name].[ext]' },
    { test: /\.woff2$/, loader: 'url?limit=65000&mimetype=application/font-woff2&name=public/fonts/[name].[ext]' },
    { test: /\.[ot]tf$/, loader: 'url?limit=65000&mimetype=application/octet-stream&name=public/fonts/[name].[ext]' },
    { test: /\.eot$/, loader: 'url?limit=65000&mimetype=application/vnd.ms-fontobject&name=public/fonts/[name].[ext]' }
  ]
},

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM