Vue2.0+webpack 引入字体文件(eot,ttf,woff)

Vue2.0+webpack 引入字体文件(eot,ttf,woff)_第1张图片

 webpack.base.config.js 

需要配置

     {

        test:/\/(woff2?|eot|ttf|otf)(\?.*)?$/,
        
        loader: 'url-loader',
        
        options: {
        
        limit: 10000,
        
        name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
        
        }
      }

如果 Vue2.0+webpack3.6引入字体文件(eot,ttf,woff)路径报错

These relative modules were not found:

* ../fonts/music-icon.eot?2qevqt in ./node_modules/css-loader?{"sourceMap":true}!./node_modules/postcss-loader/lib?{"sourceMap":true}!./node_modules/stylus-loader?{"sourceMap":true}!./src/common/stylus/index.styl
* ../fonts/music-icon.svg?2qevqt in ./node_modules/css-loader?{"sourceMap":true}!./node_modules/postcss-loader/lib?{"sourceMap":true}!./node_modules/stylus-loader?{"sourceMap":true}!./src/common/stylus/index.styl
* ../fonts/music-icon.ttf?2qevqt in ./node_modules/css-loader?{"sourceMap":true}!./node_modules/postcss-loader/lib?{"sourceMap":true}!./node_modules/stylus-loader?{"sourceMap":true}!./src/common/stylus/index.styl
* ../fonts/music-icon.woff?2qevqt in ./node_modules/css-loader?{"sourceMap":true}!./node_modules/postcss-loader/lib?{"sourceMap":true}!./node_modules/stylus-loader?{"sourceMap":true}!./src/common/stylus/index.styl

将font.css 路径修改为 

 src: url('/static/fonts/music-icon.eot?2qevqt')
  src: url('/static/fonts/music-icon.eot?2qevqt#iefix') format('embedded-opentype'),
          url('/static/fonts/music-icon.ttf?2qevqt') format('truetype'),
          url('/static/fonts/music-icon.woff?2qevqt') format('woff'),
          url('/static/fonts/music-icon.svg?2qevqt#music-icon') format('svg')

你可能感兴趣的:(前端,javascript,开发语言)