Element was initially written in Vue, which has many elegant UI components, but we also love React, so we forked it for the React community.
npm install element-react --saveBefore the building, you need a style theme, here we recommend you to pick up element-theme-default.
npm install element-theme-default --saveWe are die hard fans of ECMAScript 6, so we recommend you writing code in modern javascript.
import { Button } from 'element-react';Also we provide an advanced way to tree shaking the code with Rollup.js and Webpack 2
import { Button } from 'element-react/next';With webpack, you need additional loaders to build with element-react.
const webpack = require('webpack');
module.exports = {
entry: {
src: 'path/to/src'
},
output: {
path: 'path/to/output'
publicPath: '/public',
chunkFilename: '[chunkhash:12].js',
filename: '[chunkhash:12].js'
},
plugins: [
new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify('production') }),
new webpack.optimize.UglifyJsPlugin({
output: {
comments: false
}
})
],
resolve: {
extensions: ['.js', '.jsx']
},
module: {
loaders: [
{
test: /\.jsx?$/,
loader: 'babel-loader',
include: ['path/to/src']
},
{
test: /\.css$/,
loaders: ['style-loader', 'css-loader']
},
{
test: /\.(ttf|eot|svg|woff|woff2)(\?.+)?$/,
loader: 'file-loader?name=[hash:12].[ext]'
}
]
}
}Please make sure to read the Contributing Guide before making a pull request.
- @doxiaodong for adding typescript ambient declarations.
- @cuining for building the live code editor.
- Element Desktop UI elements for Vue.js 2.0.
MIT
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent