FEMessage / el-data-table

🥘Base on element-ui, makes crud easily
https://femessage.github.io/el-data-table/
MIT License
486 stars 112 forks source link

html中使用el-data-table #303

Closed anding-coder closed 4 years ago

anding-coder commented 4 years ago

html中可以使用el-data-table吗? 怎么使用?

shoyuf commented 4 years ago

记录结果

el-data-table/build/rullup.config.js 构建配置

import vue from 'rollup-plugin-vue'
import commonjs from 'rollup-plugin-commonjs'
import nodeResolve from '@rollup/plugin-node-resolve'
import babel from 'rollup-plugin-babel'
import { terser } from 'rollup-plugin-terser'

export default {
  input: 'src/index.js',
  output: {
    name: 'ElDataTable',
    exports: 'named'
  },
  plugins: [
    vue({ css: true }),
    commonjs(),
    nodeResolve(),
    terser(),
    babel({
      babelrc: false,
      runtimeHelpers: true,
      presets: [
        [
          '@babel/env',
        ]
      ],
      plugins: [
        [
          '@babel/transform-runtime',
          {
            helpers: false,
            absoluteRuntime: true,
            regenerator: false,
          }
        ],
        "@babel/plugin-transform-async-to-generator",
        "@babel/plugin-transform-regenerator",
      ]
    })
  ]
}

// el-data-table

el-form-renderer/build/rollup.config.js 新增浏览器构建配置

import vue from 'rollup-plugin-vue'
import babel from 'rollup-plugin-babel'
import commonjs from 'rollup-plugin-commonjs'
import {terser} from 'rollup-plugin-terser'
import minimist from 'minimist'
import nodeResolve from '@rollup/plugin-node-resolve'

const argv = minimist(process.argv.slice(2))

const config = {
  input: 'src/index.js',
  output: {
    name: 'ElFormRenderer',
    exports: 'named'
  },
  plugins: [
    commonjs(),
    nodeResolve(),
    vue({
      css: true,
      compileTemplate: true
    }),
    babel({
      babelrc: false,
      runtimeHelpers: true,
      presets: [
        [
          '@babel/env',
        ]
      ],
      plugins: [
        [
          '@babel/transform-runtime',
          {
            helpers: false,
            absoluteRuntime: true,
            regenerator: false,
          }
        ],
        "@babel/plugin-transform-async-to-generator",
        "@babel/plugin-transform-regenerator",
      ]
    })
  ]
}

// Only minify browser (iife) version
if (argv.format === 'iife') {
  config.plugins.push(terser())
}

export default config

// el-form-renderer
// https://github.com/FEMessage/el-form-renderer
// 同样需要对这个组件做类似的操作