├── src
    ├── styles
    │   └── common.css
    ├── images
    │   └── logo.png
    ├── vendors.js
    ├── config
    │   └── config.js
    ├── libs
    │   └── util.js
    ├── router.js
    ├── app.vue
    ├── template
    │   └── index.ejs
    ├── main.js
    └── views
    │   └── index.vue
├── .babelrc
├── .gitignore
├── README.md
├── LICENSE
├── webpack.dev.config.js
├── webpack.prod.config.js
├── package.json
└── webpack.base.config.js


/src/styles/common.css:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 |   "presets": [
3 |     ["es2015", { "modules": false }]
4 |   ]
5 | }
6 | 


--------------------------------------------------------------------------------
/src/images/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/gytai/iview-project/3.0/src/images/logo.png


--------------------------------------------------------------------------------
/src/vendors.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue';
2 | import iView from 'iview';
3 | import VueRouter from 'vue-router';


--------------------------------------------------------------------------------
/src/config/config.js:
--------------------------------------------------------------------------------
1 | import Env from './env';
2 | 
3 | let config = {
4 |     env: Env
5 | };
6 | export default config;


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | .idea
 2 | .idea/
 3 | .DS_Store
 4 | node_modules/
 5 | .project
 6 | dist
 7 | dist/*
 8 | src/config/*.tmp
 9 | src/config/env.js
10 | /index.html
11 | /index_prod.html


--------------------------------------------------------------------------------
/src/libs/util.js:
--------------------------------------------------------------------------------
1 | let util = {
2 | 
3 | };
4 | util.title = function (title) {
5 |     title = title ? title + ' - Home' : 'iView project';
6 |     window.document.title = title;
7 | };
8 | 
9 | export default util;


--------------------------------------------------------------------------------
/src/router.js:
--------------------------------------------------------------------------------
 1 | const routers = [
 2 |     {
 3 |         path: '/',
 4 |         meta: {
 5 |             title: ''
 6 |         },
 7 |         component: (resolve) => require(['./views/index.vue'], resolve)
 8 |     }
 9 | ];
10 | export default routers;


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # iView-project
 2 | 
 3 | This project is build for Vue.js 2 + vue-router + webpack2 + iView 3, just install and run.
 4 | 
 5 | ## Install
 6 | ```bush
 7 | // install dependencies
 8 | npm install
 9 | ```
10 | ## Run
11 | ### Development
12 | ```bush
13 | // For the first time, run init to create index.html
14 | npm run init
15 | npm run dev
16 | ```
17 | ### Production(Build)
18 | ```bush
19 | npm run build
20 | ```
21 | 
22 | 


--------------------------------------------------------------------------------
/src/app.vue:
--------------------------------------------------------------------------------
 1 | <style scoped>
 2 |     @import 'styles/common.css';
 3 | </style>
 4 | <template>
 5 |     <div>
 6 |         <router-view></router-view>
 7 |     </div>
 8 | </template>
 9 | <script>
10 |     export default {
11 |         data () {
12 |             return {}
13 |         },
14 |         mounted () {
15 | 
16 |         },
17 |         beforeDestroy () {
18 | 
19 |         },
20 |         methods: {
21 | 
22 |         }
23 |     }
24 | </script>
25 | 


--------------------------------------------------------------------------------
/src/template/index.ejs:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="zh-CN">
 3 | 
 4 | <head>
 5 |     <title>iView project</title>
 6 |     <meta charset="UTF-8">
 7 |     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
 8 |     <link rel="stylesheet" href="<%= htmlWebpackPlugin.files.css[0] %>">
 9 | </head>
10 | 
11 | <body>
12 |     <div id="app"></div>
13 |     <script type="text/javascript" src="<%= htmlWebpackPlugin.files.js[0] %>"></script>
14 |     <script type="text/javascript" src="<%= htmlWebpackPlugin.files.js[1] %>"></script>
15 | </body>
16 | </html>


--------------------------------------------------------------------------------
/src/main.js:
--------------------------------------------------------------------------------
 1 | import Vue from 'vue';
 2 | import iView from 'iview';
 3 | import VueRouter from 'vue-router';
 4 | import Routers from './router';
 5 | import Util from './libs/util';
 6 | import App from './app.vue';
 7 | import 'iview/dist/styles/iview.css';
 8 | 
 9 | Vue.use(VueRouter);
10 | Vue.use(iView);
11 | 
12 | // 路由配置
13 | const RouterConfig = {
14 |     mode: 'history',
15 |     routes: Routers
16 | };
17 | const router = new VueRouter(RouterConfig);
18 | 
19 | router.beforeEach((to, from, next) => {
20 |     iView.LoadingBar.start();
21 |     Util.title(to.meta.title);
22 |     next();
23 | });
24 | 
25 | router.afterEach((to, from, next) => {
26 |     iView.LoadingBar.finish();
27 |     window.scrollTo(0, 0);
28 | });
29 | 
30 | new Vue({
31 |     el: '#app',
32 |     router: router,
33 |     render: h => h(App)
34 | });
35 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2016 iView
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/webpack.dev.config.js:
--------------------------------------------------------------------------------
 1 | const webpack = require('webpack');
 2 | const HtmlWebpackPlugin = require('html-webpack-plugin');
 3 | const ExtractTextPlugin = require('extract-text-webpack-plugin');
 4 | const merge = require('webpack-merge');
 5 | const webpackBaseConfig = require('./webpack.base.config.js');
 6 | const fs = require('fs');
 7 | 
 8 | fs.open('./src/config/env.js', 'w', function (err, fd) {
 9 |     const buf = 'export default "development";';
10 |     fs.write(fd, buf, 0, buf.length, 0, function (err, written, buffer){});
11 | });
12 | 
13 | module.exports = merge(webpackBaseConfig, {
14 |     devtool: '#source-map',
15 |     output: {
16 |         publicPath: '/dist/',
17 |         filename: '[name].js',
18 |         chunkFilename: '[name].chunk.js'
19 |     },
20 |     plugins: [
21 |         new ExtractTextPlugin({
22 |             filename: '[name].css',
23 |             allChunks: true
24 |         }),
25 |         new webpack.optimize.CommonsChunkPlugin({
26 |             name: 'vendors',
27 |             filename: 'vendors.js'
28 |         }),
29 |         new HtmlWebpackPlugin({
30 |             filename: '../index.html',
31 |             template: './src/template/index.ejs',
32 |             inject: false
33 |         })
34 |     ]
35 | });


--------------------------------------------------------------------------------
/src/views/index.vue:
--------------------------------------------------------------------------------
 1 | <style scoped lang="less">
 2 |     .index{
 3 |         width: 100%;
 4 |         position: absolute;
 5 |         top: 0;
 6 |         bottom: 0;
 7 |         left: 0;
 8 |         text-align: center;
 9 |         h1{
10 |             height: 150px;
11 |             img{
12 |                 height: 100%;
13 |             }
14 |         }
15 |         h2{
16 |             color: #666;
17 |             margin-bottom: 200px;
18 |             p{
19 |                 margin: 0 0 50px;
20 |             }
21 |         }
22 |         .ivu-row-flex{
23 |             height: 100%;
24 |         }
25 |     }
26 | </style>
27 | <template>
28 |     <div class="index">
29 |         <Row type="flex" justify="center" align="middle">
30 |             <Col span="24">
31 |                 <h1>
32 |                     <img src="../images/logo.png">
33 |                 </h1>
34 |                 <h2>
35 |                     <p>Welcome to your iView app!</p>
36 |                     <Button @click="handleStart">Start iView</Button>
37 |                 </h2>
38 |             </Col>
39 |         </Row>
40 |     </div>
41 | </template>
42 | <script>
43 |     export default {
44 |         methods: {
45 |             handleStart () {
46 |                 this.$Modal.info({
47 |                     title: 'Bravo',
48 |                     content: 'Now, enjoy the convenience of iView.'
49 |                 });
50 |             }
51 |         }
52 |     }
53 | </script>
54 | 


--------------------------------------------------------------------------------
/webpack.prod.config.js:
--------------------------------------------------------------------------------
 1 | const webpack = require('webpack');
 2 | const HtmlWebpackPlugin = require('html-webpack-plugin');
 3 | const ExtractTextPlugin = require('extract-text-webpack-plugin');
 4 | const merge = require('webpack-merge');
 5 | const webpackBaseConfig = require('./webpack.base.config.js');
 6 | const fs = require('fs');
 7 | 
 8 | fs.open('./src/config/env.js', 'w', function (err, fd) {
 9 |     const buf = 'export default "production";';
10 |     fs.write(fd, buf, 0, buf.length, 0, function (err, written, buffer){});
11 | });
12 | 
13 | module.exports = merge(webpackBaseConfig, {
14 |     output: {
15 |         publicPath: '/dist/',
16 |         filename: '[name].[hash].js',
17 |         chunkFilename: '[name].[hash].chunk.js'
18 |     },
19 |     plugins: [
20 |         new ExtractTextPlugin({
21 |             filename: '[name].[hash].css',
22 |             allChunks: true
23 |         }),
24 |         new webpack.optimize.CommonsChunkPlugin({
25 |             name: 'vendors',
26 |             filename: 'vendors.[hash].js'
27 |         }),
28 |         new webpack.DefinePlugin({
29 |             'process.env': {
30 |                 NODE_ENV: '"production"'
31 |             }
32 |         }),
33 |         new webpack.optimize.UglifyJsPlugin({
34 |             compress: {
35 |                 warnings: false
36 |             }
37 |         }),
38 |         new HtmlWebpackPlugin({
39 |             filename: '../index_prod.html',
40 |             template: './src/template/index.ejs',
41 |             inject: false
42 |         })
43 |     ]
44 | });


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "iview-project",
 3 |   "version": "3.0.0",
 4 |   "description": "A base project with Vue.js2、Vue-Router、webpack2 and with iView3.",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "init": "webpack --progress --config webpack.dev.config.js",
 8 |     "dev": "webpack-dev-server --content-base ./ --open --inline --hot --compress --history-api-fallback --config webpack.dev.config.js",
 9 |     "build": "webpack --progress --hide-modules --config webpack.prod.config.js"
10 |   },
11 |   "repository": {
12 |     "type": "git",
13 |     "url": "git+https://github.com/iview/iview-project.git"
14 |   },
15 |   "author": "Aresn",
16 |   "license": "MIT",
17 |   "dependencies": {
18 |     "iview": "^3.0.0",
19 |     "vue": "^2.5.16",
20 |     "vue-router": "^2.8.1"
21 |   },
22 |   "devDependencies": {
23 |     "autoprefixer-loader": "^2.0.0",
24 |     "babel": "^6.23.0",
25 |     "babel-core": "^6.23.1",
26 |     "babel-loader": "^6.2.4",
27 |     "babel-plugin-transform-runtime": "^6.12.0",
28 |     "babel-preset-es2015": "^6.9.0",
29 |     "babel-runtime": "^6.11.6",
30 |     "css-loader": "^0.23.1",
31 |     "extract-text-webpack-plugin": "^2.0.0",
32 |     "file-loader": "^0.8.5",
33 |     "html-loader": "^0.3.0",
34 |     "html-webpack-plugin": "^2.28.0",
35 |     "iview-loader": "^1.2.1",
36 |     "less": "^2.7.1",
37 |     "less-loader": "^2.2.3",
38 |     "style-loader": "^0.13.1",
39 |     "url-loader": "^0.5.7",
40 |     "vue-hot-reload-api": "^1.3.3",
41 |     "vue-html-loader": "^1.2.3",
42 |     "vue-loader": "^11.0.0",
43 |     "vue-style-loader": "^1.0.0",
44 |     "vue-template-compiler": "^2.2.1",
45 |     "webpack": "^2.2.1",
46 |     "webpack-dev-server": "^2.4.1",
47 |     "webpack-merge": "^3.0.0"
48 |   },
49 |   "bugs": {
50 |     "url": "https://github.com/iview/iview-project/issues"
51 |   },
52 |   "homepage": "https://www.iviewui.com"
53 | }
54 | 


--------------------------------------------------------------------------------
/webpack.base.config.js:
--------------------------------------------------------------------------------
 1 | const path = require('path');
 2 | const webpack = require('webpack');
 3 | const ExtractTextPlugin = require('extract-text-webpack-plugin');
 4 | 
 5 | module.exports = {
 6 |     entry: {
 7 |         main: './src/main',
 8 |         vendors: './src/vendors'
 9 |     },
10 |     output: {
11 |         path: path.join(__dirname, './dist')
12 |     },
13 |     module: {
14 |         rules: [
15 |             {
16 |                 test: /\.vue$/,
17 |                 use: [
18 |                     {
19 |                         loader: 'vue-loader',
20 |                         options: {
21 |                             loaders: {
22 |                                 less: ExtractTextPlugin.extract({
23 |                                     use: ['css-loader?minimize', 'autoprefixer-loader', 'less-loader'],
24 |                                     fallback: 'vue-style-loader'
25 |                                 }),
26 |                                 css: ExtractTextPlugin.extract({
27 |                                     use: ['css-loader', 'autoprefixer-loader', 'less-loader'],
28 |                                     fallback: 'vue-style-loader'
29 |                                 })
30 |                             }
31 |                         }
32 |                     },
33 |                     {
34 |                         loader: 'iview-loader',
35 |                         options: {
36 |                             prefix: false
37 |                         }
38 |                     }
39 |                 ]
40 |             },
41 |             {
42 |                 test: /iview\/.*?js$/,
43 |                 loader: 'babel-loader'
44 |             },
45 |             {
46 |                 test: /\.js$/,
47 |                 loader: 'babel-loader',
48 |                 exclude: /node_modules/
49 |             },
50 |             {
51 |                 test: /\.css$/,
52 |                 use: ExtractTextPlugin.extract({
53 |                     use: ['css-loader?minimize', 'autoprefixer-loader'],
54 |                     fallback: 'style-loader'
55 |                 })
56 |             },
57 |             {
58 |                 test: /\.less/,
59 |                 use: ExtractTextPlugin.extract({
60 |                     use: ['css-loader?minimize', 'autoprefixer-loader', 'less-loader'],
61 |                     fallback: 'style-loader'
62 |                 })
63 |             },
64 |             {
65 |                 test: /\.(gif|jpg|png|woff|svg|eot|ttf)\??.*$/,
66 |                 loader: 'url-loader?limit=1024'
67 |             },
68 |             {
69 |                 test: /\.(html|tpl)$/,
70 |                 loader: 'html-loader'
71 |             }
72 |         ]
73 |     },
74 |     resolve: {
75 |         extensions: ['.js', '.vue'],
76 |         alias: {
77 |             'vue': 'vue/dist/vue.esm.js'
78 |         }
79 |     }
80 | };


--------------------------------------------------------------------------------