移动端适配

90 阅读1分钟
var utils = require('./utils');
var config = require('../config');

var isProduction = process.env.NODE_ENV !== 'development';

var loaders = utils.cssLoaders({
  sourceMap: isProduction ? config.build.productionSourceMap : config.dev.cssSourceMap,
  extract: isProduction,
});

const postcssNormalize = require('postcss-normalize');

function resolve(dir) {
  return path.join(__dirname, '..', dir);
}

var configJs;
switch (process.env.NODE_ENV) {
  case 'development':
    configJs = 'config/env-dev.js';
    break;
  case 'tester':
    configJs = 'config/env-tester.js';
    break;
  case 'demo':
    configJs = 'config/env-demo.js';
    break;
  case 'production':
    configJs = 'config/env-prod.js';
    break;
  default:
    configJs = 'config/env-dev.js';
}

module.exports = {
  entry: {
    app: ['@babel/polyfill', './src/main.jsx'],
    // polyfill: 'babel-polyfill'
  },
  // entry: ["babel-polyfill", "./src/main.jsx"],
  output: {
    path: config.build.assetsRoot,
    filename: '[name].js',
    publicPath:
      process.env.NODE_ENV === 'production'
        ? config.build.assetsPublicPath
        : config.dev.assetsPublicPath,
  },
  resolve: {
    extensions: ['.js', '.jsx', '.scss', '.less', '.css'],
    modules: ['node_modules', resolve('src')],
    alias: {
      config: configJs,
      '@': resolve('src'),
      '@api':resolve("src/api"),
      '@components':resolve("src/components")
    },
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        loader: 'eslint-loader',
        enforce: 'pre',
        include: [resolve('src'), resolve('test')],
        options: {
          formatter: require('eslint-friendly-formatter'),
          fix: true,
        },
      },
      {
        test: /\.(js|jsx)$/,
        use: {
          loader: 'babel-loader',
        },
        include: [
          resolve('src'),
          resolve('test'),
          resolve('node_modules/_fast-xml-parser@3.15.1@fast-xml-parser'),
        ],
      },
      {
        test: /\.(css)$/,
        use: loaders['css'],
      },
      {
        test: /\.less$/,
        use: loaders['less'],
        include: /node_modules/,
      },
      {
        test: /\.scss$/,
        use: loaders['scss'].concat([
          {
            loader: 'sass-resources-loader',
            options: {
              resources: [
                resolve('src/styles/variable.scss'),
                resolve(__dirname, 'src/assets/scss/variable.scss'),
              ],
            },
          },
          {
            loader: require.resolve('postcss-loader'),
            options: {
              ident: 'postcss',
              plugins: () => [
                require('postcss-flexbugs-fixes'),
                require('postcss-preset-env')({
                  autoprefixer: {
                    flexbox: 'no-2009',
                  },
                  stage: 3,
                }),
                require('postcss-pxtorem')({
                  rootValue: 16,
                  unitPrecision: 5,
                  propWhiteList: [],
                  minPixelValue: 2,
                }),
                postcssNormalize(),
              ],
              sourceMap: isProduction ? config.build.productionSourceMap : config.dev.cssSourceMap,
            },
          }
        ]),
      },
      {
        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
        loader: 'url-loader',
        options: {
          limit: 10000,
          name: utils.assetsPath('img/[name].[hash:7].[ext]'),
        },
      },
      {
        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
        loader: 'url-loader',
        options: {
          limit: 10000,
          name: utils.assetsPath('fonts/[name].[hash:7].[ext]'),
        },
      },
    ],
  },
};