字体标记在我的vue项目中不起作用

时间:2017-06-06 09:12:18

标签: webpack vuejs2 webpack-2

<font size="7">123</font>

如上所述,我认为这是webpack配置问题, 因为我使用vue-cli来构建字体生效的项目

webpack配置我不太熟悉,请大家帮忙看看有什么问题,谢谢

以下是配置

const path = require('path')
const del = require('del')
const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const distName = 'bbs-admin'

const Config = {
  context: path.resolve(__dirname, 'src'),
  entry: {
    'main': './main.js'
  },
  output: {
    filename: 'js/[name].[chunkhash:6].js',
    path: path.resolve(__dirname, `./${distName}`),
    publicPath: ''
  },
  module: {
    rules: [
      { test: /\.html$/, use: 'html-loader' },
      { test: /\.less$/, use: ExtractTextPlugin.extract({ use: ['css-loader', 'less-loader'], fallback: 'style-loader', publicPath: '../' }) },
      { test: /\.css$/, use: ExtractTextPlugin.extract({ use: ['css-loader'], fallback: 'style-loader', publicPath: '../' }) },
      { test: /data.*\.json$/, use: 'url-loader?limit=1&name=data/[name].[ext]' },
      { test: /(comps|common).*\.json$/, use: 'json-loader' },
      { test: /\.(png|jpg|gif|svg)$/, use: 'url-loader?limit=233&name=[path][name].[ext]' },
      { test: /\.(mp3)$/, use: 'url-loader?limit=1&name=audio/[name].[hash:6].[ext]' },
      { test: /\.(eot|ttf|woff)$/, use: 'url-loader?limit=233&name=fonts/[name].[hash:6].[ext]' },
      { test: /\.js$/, use: 'babel-loader', exclude: /(node_modules)|(ueditor)/ },
      { test: /\.vue$/, loader: 'vue-loader', options: require('./vue-loader-options') }
    ]
  },
  resolve: {
    alias: {
      images: path.resolve(__dirname, './src/images/'),
      data: path.resolve(__dirname, './src/data/'),
      // public: path.resolve(__dirname, './public/'),
    },
    modules: [`./src/common`, `./src/comps`, `./src/config`, 'node_modules/'],
    extensions: ['.js', '.json']
  },
  externals: {
    env: /production/.test(process.env.NODE_ENV) ? '"pro"' : '"dev"'
  },
  plugins: [
    new HtmlWebpackPlugin({ template: 'index.html' }),
    new ExtractTextPlugin({ filename: 'css/[name].[contenthash:6].css' })
  ],
  devServer: {
    contentBase: path.join(__dirname, ''),
    inline: true,
    host: '0.0.0.0',
    port: 9090,
    disableHostCheck: true,
  },
  performance: { hints: false }, 
  devtool: 'source-map'
}

console.info(process.env.NODE_ENV)
if (/production/.test(process.env.NODE_ENV)) {
  del.sync(`${distName}/**`)
  Config.devtool = ''
  Config.plugins.push(new webpack.optimize.UglifyJsPlugin({
    compress: {
      'drop_console': true,
      unused: false,
      'side_effects': false
    },
    comments: false
  }),
    new CopyWebpackPlugin([
      { from: 'public/**/*', context: __dirname }
    ])
  )
}
module.exports = Config

0 个答案:

没有答案