hot-form/vue.config.js

A project developed based on ant-design-vue and vant whitch do some things on create/render/modify and etc. for forms. Also can custom some component on the form items if you want. 一个基于antdv/vant开发的创建表单组件，包含表单渲染、表单编辑页面、以及植入自定义附加内容的组件

const fs = require('fs');
const path = require('path');
const join = path.join;
const resolve = dir => path.join(__dirname, './', dir);
const PACKAGE = require('./package.json');
const isProduction = process.env.NODE_ENV === 'production';

// 复制 tinymce 所需的静态资源
const copyOptions = [
  {
    from: resolve('./src/projectComponents/Tinymce/langs'),
    to: './tinymce/langs',
  },
  {
    from: resolve('./node_modules/tinymce/skins'),
    to: './tinymce/skins',
  },
];

function getComponentEntries(path) {
  let files = fs.readdirSync(resolve(path));
  const componentEntries = files.reduce((ret, item) => {
    const itemPath = join(path, item);
    const isDir = fs.statSync(itemPath).isDirectory();
    if (isDir) {
      ret[item] = resolve(join(itemPath, 'index.js'));
    } else {
      const [name] = item.split('.');
      ret[name] = resolve(`${itemPath}`);
    }
    return ret;
  }, {});
  return componentEntries;
}

module.exports = {
  // 指定将构建好的文件输出目录，默认为dist目录
  // outputDir: 'dist',
  css: {
    sourceMap: !isProduction,
    loaderOptions: {
      less: {
        lessOptions: {
          javascriptEnabled: true,
          modifyVars: {
            'primary-color': '#52A7B5',
            'link-color': '#52A7B5',
          },
        },
      },
    },
  },
  devServer: {
    overlay: {
      warnings: false,
      errors: true,
    },
  },
  // webpack 配置
  configureWebpack: config => {
    // 不将 `vue` 打包到生产环境中，而是让打好的包去它的运行环境中找 `vue` 依赖，让运行环境决定用哪个版本的 `vue`
    if (isProduction) {
      config.externals = {
        'vue': 'vue',
        'vant': 'vant',
        'tinymce': 'tinymce',
        'vuedraggable': 'vuedraggable',
        'Antd': 'ant-design-vue',
      };
    }
  },
  chainWebpack: config => {
    config.resolve.alias.set('@', resolve('src'));
    config.resolve.alias.set('@c', resolve('src/components'));
    config.resolve.alias.set('@p', resolve('src/projectComponents'));
    // 修改 copy-webpack-plugin (modern 模式只会在第二次打包时复制，因此需要判断)
    const hasCopy = config.plugins.has('copy');
    if (hasCopy && !isProduction) config.plugin('copy').tap(args => [args[0].concat(copyOptions)]);

    const hasHtml = config.plugins.has('html');
    if (hasHtml)
      config.plugin('html').tap(args => {
        args[0].title = PACKAGE.name;
        return args;
      });
  },
  productionSourceMap: false,
}