├── test
└── index.js
├── components
└── index.js
├── .gitignore
├── style
├── main.stylus
└── main.sty
├── src
├── main.js
└── main.vue
├── lib
└── rem.js
├── template
└── index.html
├── LICENSE
├── README.md
└── package.json
/test/index.js:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/components/index.js:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules/*
2 | dist/*
3 | static/*
4 |
--------------------------------------------------------------------------------
/style/main.stylus:
--------------------------------------------------------------------------------
1 | div
2 | diaplay flex
3 | color #f2f2f2
4 |
--------------------------------------------------------------------------------
/style/main.sty:
--------------------------------------------------------------------------------
1 | div
2 | display flex
3 | color #f2f2f2
4 | transform scale(1.2)
5 |
--------------------------------------------------------------------------------
/src/main.js:
--------------------------------------------------------------------------------
1 | require('../style/main.sty')
2 | var main = require('./main.vue')
3 | new Vue(main)
4 |
--------------------------------------------------------------------------------
/src/main.vue:
--------------------------------------------------------------------------------
1 |
7 |
8 |
17 |
18 |
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/lib/rem.js:
--------------------------------------------------------------------------------
1 | ;(function(){
2 | var width = document.documentElement.getBoundingClientRect().width;
3 | document.documentElement.style.fontSize = document.documentElement.getBoundingClientRect().width/10+"px"
4 | var rem = {}
5 | rem.toPx = function(rem){
6 | return rem * width / 10
7 | }
8 | rem.toRem = function(px){
9 | return px * 10 / width
10 | }
11 | window.rem = rem;
12 | })()
13 |
14 |
--------------------------------------------------------------------------------
/template/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | index
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2016 NiuYc
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 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # vue-webpack-init
2 | A scaffold template for the first step.
3 |
4 |
5 | ## Usage
6 | ```
7 | git clone https://github.com/banama/vue-webpack-init && cnpm install
8 |
9 | npm run dev // run on dev mode
10 |
11 | npm run pro // run on pro mode
12 |
13 | npm run live // run on lvie and develop mode (hmr and so on)
14 | ```
15 |
16 | or
17 |
18 | [vue-cli](https://github.com/vuejs/vue-cli)
19 |
20 | ## Other
21 |
22 | `Vue-template-init` is a scaffold. It will bring a template project for you.
23 | * vue.js
24 | * webpack
25 | * [webpack-boost](https://github.com/banama/webpack-boost)(A simple lib for config webpack.)
26 | * postcss (cssnano | autoprefixer)
27 | * babel
28 | * scss/stylus/less
29 | * vue-loader
30 |
31 | ## Branch
32 |
33 | There are some version scaffold.
34 |
35 | * master (vue + webpack)
36 |
37 | > git clone https://github.com/banama/vue-webpack-init
38 |
39 | * SPA (Vue + Webpack + Vue-router)
40 |
41 | > git clone -b SPA https://github.com/banama/vue-webpack-init
42 |
43 | * SPA-vuex (Vue + Webpack + Vue-router + Vuex)
44 |
45 | > git clone -b SPA-vuex https://github.com/banama/vue-webpack-init
46 |
47 | * SPA-redux (Vue + Webpack + Vue-router + Redux)
48 |
49 | > git clone -b SPA-redux https://github.com/banama/vue-webpack-init
50 |
51 | ## Tree (master)
52 |
53 | ```
54 | ├── LICENSE
55 | ├── README.md
56 | ├── build.js
57 | ├── components
58 | │ └── index.js
59 | ├── lib
60 | │ └── rem.js
61 | ├── node_modules
62 | ├── package.json
63 | ├── src
64 | │ ├── main.js
65 | │ └── main.vue
66 | ├── style
67 | │ └── main.style
68 | ├── template
69 | │ └── index.html
70 | └── test
71 | ```
72 |
73 | ## License
74 | https://opensource.org/licenses/mit-license.php
75 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "vue-webpack-init",
3 | "version": "0.0.2",
4 | "description": "A scaffold template for the first step (Vue and webpack).",
5 | "main": "index.js",
6 | "scripts": {
7 | "dev": "node build.js dev",
8 | "pro": "node build.js pro",
9 | "live": "node build.js live"
10 | },
11 | "repository": {
12 | "type": "git",
13 | "url": "git+https://github.com/banama/vue-webpack-init.git"
14 | },
15 | "keywords": [
16 | "vue",
17 | "webpack",
18 | "components"
19 | ],
20 | "author": "banama",
21 | "license": "MIT",
22 | "bugs": {
23 | "url": "https://github.com/banama/vue-webpack-init/issues"
24 | },
25 | "homepage": "https://github.com/banama/vue-webpack-init#readme",
26 | "dependencies": {
27 | "webpack-boost": "^0.0.3",
28 | "autoprefixer": "^6.3.4",
29 | "babel": "^6.5.2",
30 | "babel-cli": "^6.6.5",
31 | "babel-core": "^6.2.1",
32 | "babel-loader": "^6.2.0",
33 | "babel-plugin-add-module-exports": "^0.1.2",
34 | "babel-plugin-transform-runtime": "^6.6.0",
35 | "babel-preset-es2015": "^6.6.0",
36 | "babel-preset-react": "^6.5.0",
37 | "babel-preset-react-hmre": "^1.1.1",
38 | "babel-preset-stage-0": "^6.5.0",
39 | "css-loader": "^0.21.0",
40 | "cssnano": "^3.5.2",
41 | "eslint": "^2.5.3",
42 | "eslint-config-airbnb": "^6.2.0",
43 | "eslint-plugin-react": "^4.2.3",
44 | "extract-text-webpack-plugin": "^1.0.1",
45 | "html-loader": "^0.4.3",
46 | "html-webpack-plugin": "^2.14.0",
47 | "live-server": "^0.9.2",
48 | "postcss-cli": "^2.5.1",
49 | "postcss-loader": "^0.8.2",
50 | "stylus": "^0.54.2",
51 | "stylus-loader": "^1.5.1",
52 | "supports-color": "^3.1.2",
53 | "vue-hot-reload-api": "^1.3.2",
54 | "vue-html-loader": "^1.2.0",
55 | "vue-loader": "^7.0.2",
56 | "vue-style-loader": "^1.0.0",
57 | "webpack": "^1.12.14",
58 | "webpack-clean-plugin": "^0.2.3",
59 | "webpack-dev-server": "^1.14.1",
60 | "webpack-hot-middleware": "^2.10.0",
61 | "style-loader": "^0.13.1",
62 | "vue": "^1.0.21"
63 | },
64 | "devDependencies": {}
65 | }
66 |
--------------------------------------------------------------------------------