init

ElementUI · Sep 23, 2016 · 5d5574b · 5d5574b
1 parent f1ec490
commit 5d5574b
Show file tree

Hide file tree

Showing 9 changed files with 180 additions and 1 deletion.
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,5 @@
+{
+  "presets": [
+    ["es2015", { "modules": false }]
+  ]
+}
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,5 @@
+.DS_Store
+node_modules/
+dist/
+npm-debug.log
+.idea
diff --git a/README.md b/README.md
@@ -1,2 +1,26 @@
 # element-starter
-A starter kit for Element UI generated by vue-cli
+
+> A starter kit for Element UI generated by vue-cli
+
+## Start
+
+ - Clone or download this repository
+ - Enter your local directory, and install dependencies:
+
+``` bash
+npm install
+```
+
+## Develop
+
+``` bash
+# serve with hot reload at localhost:8080
+npm run dev
+```
+
+## Build
+
+``` bash
+# build for production with minification
+npm run build
+```
diff --git a/index.html b/index.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>element-starter</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script src="dist/build.js"></script>
+  </body>
+</html>
diff --git a/package.json b/package.json
@@ -0,0 +1,26 @@
+{
+  "name": "element-starter",
+  "description": "A Vue.js project",
+  "author": "yi.shyang@ele.me",
+  "private": true,
+  "scripts": {
+    "dev": "cross-env NODE_ENV=development webpack-dev-server --inline --hot",
+    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
+  },
+  "dependencies": {
+    "element-ui": "^1.0.0-rc.4",
+    "vue": "^2.0.0-rc.6"
+  },
+  "devDependencies": {
+    "babel-core": "^6.0.0",
+    "babel-loader": "^6.0.0",
+    "babel-preset-es2015": "^6.13.2",
+    "cross-env": "^1.0.6",
+    "css-loader": "^0.23.1",
+    "file-loader": "^0.8.5",
+    "style-loader": "^0.13.1",
+    "vue-loader": "^9.4.2",
+    "webpack": "2.1.0-beta.22",
+    "webpack-dev-server": "^2.1.0-beta.0"
+  }
+}
diff --git a/src/App.vue b/src/App.vue
@@ -0,0 +1,33 @@
+<template>
+  <div id="app">
+    <img src="./assets/logo.png">
+    <h1>{{ msg }}</h1>
+    <el-button @click.native="startHacking">Let's do it</el-button>
+  </div>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      msg: 'Use Vue 2.0 Today!'
+    }
+  },
+
+  methods: {
+    startHacking () {
+      this.$notify({
+        title: 'It Works',
+        message: 'We have laid the groundwork for you. Now it\'s your time to build something epic!',
+        duration: 6000
+      })
+    }
+  }
+}
+</script>
+
+<style>
+body {
+  font-family: Helvetica, sans-serif;
+}
+</style>
diff --git a/src/assets/logo.png b/src/assets/logo.png
diff --git a/src/main.js b/src/main.js
@@ -0,0 +1,11 @@
+import Vue from 'vue'
+import ElementUI from 'element-ui'
+import 'element-ui/lib/theme-default/index.css'
+import App from './App.vue'
+
+Vue.use(ElementUI)
+
+new Vue({
+  el: '#app',
+  render: h => h(App)
+})
diff --git a/webpack.config.js b/webpack.config.js
@@ -0,0 +1,64 @@
+var path = require('path')
+var webpack = require('webpack')
+
+module.exports = {
+  entry: './src/main.js',
+  output: {
+    path: path.resolve(__dirname, './dist'),
+    publicPath: '/dist/',
+    filename: 'build.js'
+  },
+  resolveLoader: {
+    root: path.join(__dirname, 'node_modules'),
+  },
+  module: {
+    loaders: [
+      {
+        test: /\.vue$/,
+        loader: 'vue'
+      },
+      {
+        test: /\.js$/,
+        loader: 'babel',
+        exclude: /node_modules/
+      },
+      {
+        test: /\.css$/,
+        loader: 'style!css'
+      },
+      {
+        test: /\.(eot|svg|ttf|woff|woff2)$/,
+        loader: 'file'
+      },
+      {
+        test: /\.(png|jpg|gif|svg)$/,
+        loader: 'file',
+        query: {
+          name: '[name].[ext]?[hash]'
+        }
+      }
+    ]
+  },
+  devServer: {
+    historyApiFallback: true,
+    noInfo: true
+  },
+  devtool: '#eval-source-map'
+}
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports.devtool = '#source-map'
+  // http://vue-loader.vuejs.org/en/workflow/production.html
+  module.exports.plugins = (module.exports.plugins || []).concat([
+    new webpack.DefinePlugin({
+      'process.env': {
+        NODE_ENV: '"production"'
+      }
+    }),
+    new webpack.optimize.UglifyJsPlugin({
+      compress: {
+        warnings: false
+      }
+    })
+  ])
+}