Browse Source

初始化

sunqida 8 years ago
parent
commit
379c09f03d

+ 5 - 0
.babelrc

@@ -0,0 +1,5 @@
+{
+  "presets": ["es2015", "stage-2"],
+  "plugins": ["transform-runtime"],
+  "comments": false
+}

+ 9 - 0
.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

+ 2 - 0
.eslintignore

@@ -0,0 +1,2 @@
+build/*.js
+config/*.js

+ 24 - 0
.eslintrc.js

@@ -0,0 +1,24 @@
+module.exports = {
+  root: true,
+  parser: 'babel-eslint',
+  parserOptions: {
+    sourceType: 'module'
+  },
+  // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
+  extends: 'standard',
+  // required to lint *.vue files
+  plugins: [
+    'html'
+  ],
+  // add your custom rules here
+  'rules': {
+    // allow paren-less arrow functions
+    'arrow-parens': 0,
+    // allow async-await
+    'generator-star-spacing': 0,
+    // allow debugger during development
+    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
+    'space-before-function-paren': [0, {'anonymous': 'ignore', 'named': 'always' }],
+    'no-unused-vars': [2, {'args': 'none'}],
+  }
+}

+ 36 - 0
build/build.js

@@ -0,0 +1,36 @@
+// https://github.com/shelljs/shelljs
+require('./check-versions')()
+require('shelljs/global')
+env.NODE_ENV = 'production'
+
+var path = require('path')
+var config = require('../config')
+var ora = require('ora')
+var webpack = require('webpack')
+var webpackConfig = require('./webpack.prod.conf')
+
+console.log(
+  '  Tip:\n' +
+  '  Built files are meant to be served over an HTTP server.\n' +
+  '  Opening index.html over file:// won\'t work.\n'
+)
+
+var spinner = ora('building for production...')
+spinner.start()
+
+var assetsPath = path.join(config.build.assetsRoot, config.build.assetsSubDirectory)
+rm('-rf', assetsPath)
+mkdir('-p', assetsPath)
+cp('-R', 'static/*', assetsPath)
+
+webpack(webpackConfig, function (err, stats) {
+  spinner.stop()
+  if (err) throw err
+  process.stdout.write(stats.toString({
+    colors: true,
+    modules: false,
+    children: false,
+    chunks: false,
+    chunkModules: false
+  }) + '\n')
+})

+ 45 - 0
build/check-versions.js

@@ -0,0 +1,45 @@
+var semver = require('semver')
+var chalk = require('chalk')
+var packageConfig = require('../package.json')
+var exec = function (cmd) {
+  return require('child_process')
+    .execSync(cmd).toString().trim()
+}
+
+var versionRequirements = [
+  {
+    name: 'node',
+    currentVersion: semver.clean(process.version),
+    versionRequirement: packageConfig.engines.node
+  },
+  {
+    name: 'npm',
+    currentVersion: exec('npm --version'),
+    versionRequirement: packageConfig.engines.npm
+  }
+]
+
+module.exports = function () {
+  var warnings = []
+  for (var i = 0; i < versionRequirements.length; i++) {
+    var mod = versionRequirements[i]
+    if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
+      warnings.push(mod.name + ': ' +
+        chalk.red(mod.currentVersion) + ' should be ' +
+        chalk.green(mod.versionRequirement)
+      )
+    }
+  }
+
+  if (warnings.length) {
+    console.log('')
+    console.log(chalk.yellow('To use this template, you must update following to modules:'))
+    console.log()
+    for (var i = 0; i < warnings.length; i++) {
+      var warning = warnings[i]
+      console.log('  ' + warning)
+    }
+    console.log()
+    process.exit(1)
+  }
+}

+ 9 - 0
build/dev-client.js

@@ -0,0 +1,9 @@
+/* eslint-disable */
+require('eventsource-polyfill')
+var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true')
+
+hotClient.subscribe(function (event) {
+  if (event.action === 'reload') {
+    window.location.reload()
+  }
+})

+ 74 - 0
build/dev-server.js

@@ -0,0 +1,74 @@
+require('./check-versions')()
+var config = require('../config')
+if (!process.env.NODE_ENV) process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV)
+var path = require('path')
+var express = require('express')
+var webpack = require('webpack')
+var opn = require('opn')
+var proxyMiddleware = require('http-proxy-middleware')
+var webpackConfig = process.env.NODE_ENV === 'testing'
+  ? require('./webpack.prod.conf')
+  : require('./webpack.dev.conf')
+
+// default port where dev server listens for incoming traffic
+var port = process.env.PORT || config.dev.port
+// Define HTTP proxies to your custom API backend
+// https://github.com/chimurai/http-proxy-middleware
+var proxyTable = config.dev.proxyTable
+
+var app = express()
+var compiler = webpack(webpackConfig)
+
+var devMiddleware = require('webpack-dev-middleware')(compiler, {
+  publicPath: webpackConfig.output.publicPath,
+  stats: {
+    colors: true,
+    chunks: false
+  }
+})
+
+var hotMiddleware = require('webpack-hot-middleware')(compiler)
+// force page reload when html-webpack-plugin template changes
+compiler.plugin('compilation', function (compilation) {
+  compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
+    hotMiddleware.publish({ action: 'reload' })
+    cb()
+  })
+})
+
+// proxy api requests
+Object.keys(proxyTable).forEach(function (context) {
+  var options = proxyTable[context]
+  if (typeof options === 'string') {
+    options = { target: options }
+  }
+  app.use(proxyMiddleware(context, options))
+})
+
+// handle fallback for HTML5 history API
+app.use(require('connect-history-api-fallback')())
+
+// serve webpack bundle output
+app.use(devMiddleware)
+
+// enable hot-reload and state-preserving
+// compilation error display
+app.use(hotMiddleware)
+
+// serve pure static assets
+var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
+app.use(staticPath, express.static('./static'))
+
+module.exports = app.listen(port, function (err) {
+  if (err) {
+    console.log(err)
+    return
+  }
+  var uri = 'http://localhost:' + port
+  console.log('Listening at ' + uri + '\n')
+
+  // when env is testing, don't need open it
+  if (process.env.NODE_ENV !== 'testing') {
+    opn(uri)
+  }
+})

+ 61 - 0
build/utils.js

@@ -0,0 +1,61 @@
+var path = require('path')
+var config = require('../config')
+var ExtractTextPlugin = require('extract-text-webpack-plugin')
+
+exports.assetsPath = function (_path) {
+  var assetsSubDirectory = process.env.NODE_ENV === 'production'
+    ? config.build.assetsSubDirectory
+    : config.dev.assetsSubDirectory
+  return path.posix.join(assetsSubDirectory, _path)
+}
+
+exports.cssLoaders = function (options) {
+  options = options || {}
+  // generate loader string to be used with extract text plugin
+  function generateLoaders (loaders) {
+    var sourceLoader = loaders.map(function (loader) {
+      var extraParamChar
+      if (/\?/.test(loader)) {
+        loader = loader.replace(/\?/, '-loader?')
+        extraParamChar = '&'
+      } else {
+        loader = loader + '-loader'
+        extraParamChar = '?'
+      }
+      return loader + (options.sourceMap ? extraParamChar + 'sourceMap' : '')
+    }).join('!')
+
+    // Extract CSS when that option is specified
+    // (which is the case during production build)
+    if (options.extract) {
+      return ExtractTextPlugin.extract('vue-style-loader', sourceLoader)
+    } else {
+      return ['vue-style-loader', sourceLoader].join('!')
+    }
+  }
+
+  // http://vuejs.github.io/vue-loader/en/configurations/extract-css.html
+  return {
+    css: generateLoaders(['css']),
+    postcss: generateLoaders(['css']),
+    less: generateLoaders(['css', 'less']),
+    sass: generateLoaders(['css', 'sass?indentedSyntax']),
+    scss: generateLoaders(['css', 'sass']),
+    stylus: generateLoaders(['css', 'stylus']),
+    styl: generateLoaders(['css', 'stylus'])
+  }
+}
+
+// Generate loaders for standalone style files (outside of .vue)
+exports.styleLoaders = function (options) {
+  var output = []
+  var loaders = exports.cssLoaders(options)
+  for (var extension in loaders) {
+    var loader = loaders[extension]
+    output.push({
+      test: new RegExp('\\.' + extension + '$'),
+      loader: loader
+    })
+  }
+  return output
+}

+ 94 - 0
build/webpack.base.conf.js

@@ -0,0 +1,94 @@
+var path = require('path')
+var config = require('../config')
+var utils = require('./utils')
+var projectRoot = path.resolve(__dirname, '../')
+
+var env = process.env.NODE_ENV
+// check env & config/index.js to decide weither to enable CSS Sourcemaps for the
+// various preprocessor loaders added to vue-loader at the end of this file
+var cssSourceMapDev = (env === 'development' && config.dev.cssSourceMap)
+var cssSourceMapProd = (env === 'production' && config.build.productionSourceMap)
+var useCssSourceMap = cssSourceMapDev || cssSourceMapProd
+
+module.exports = {
+  entry: {
+    app: './src/main.js'
+  },
+  output: {
+    path: config.build.assetsRoot,
+    publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath,
+    filename: '[name].js'
+  },
+  resolve: {
+    extensions: ['', '.js', '.vue'],
+    fallback: [path.join(__dirname, '../node_modules')],
+    alias: {
+      'vue$': 'vue/dist/vue.common.js',
+      'src': path.resolve(__dirname, '../src'),
+      'assets': path.resolve(__dirname, '../src/assets'),
+      'components': path.resolve(__dirname, '../src/components')
+    }
+  },
+  resolveLoader: {
+    fallback: [path.join(__dirname, '../node_modules')]
+  },
+  module: {
+    preLoaders: [
+      {
+        test: /\.vue$/,
+        loader: 'eslint',
+        include: projectRoot,
+        exclude: /node_modules/
+      },
+      {
+        test: /\.js$/,
+        loader: 'eslint',
+        include: projectRoot,
+        exclude: /node_modules/
+      }
+    ],
+    loaders: [
+      {
+        test: /\.vue$/,
+        loader: 'vue'
+      },
+      {
+        test: /\.js$/,
+        loader: 'babel',
+        include: projectRoot,
+        exclude: /node_modules/
+      },
+      {
+        test: /\.json$/,
+        loader: 'json'
+      },
+      {
+        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
+        loader: 'url',
+        query: {
+          limit: 10000,
+          name: utils.assetsPath('img/[name].[hash:7].[ext]')
+        }
+      },
+      {
+        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
+        loader: 'url',
+        query: {
+          limit: 10000,
+          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
+        }
+      }
+    ]
+  },
+  eslint: {
+    formatter: require('eslint-friendly-formatter')
+  },
+  vue: {
+    loaders: utils.cssLoaders({ sourceMap: useCssSourceMap }),
+    postcss: [
+      require('autoprefixer')({
+        browsers: ['last 2 versions']
+      })
+    ]
+  }
+}

+ 34 - 0
build/webpack.dev.conf.js

@@ -0,0 +1,34 @@
+var config = require('../config')
+var webpack = require('webpack')
+var merge = require('webpack-merge')
+var utils = require('./utils')
+var baseWebpackConfig = require('./webpack.base.conf')
+var HtmlWebpackPlugin = require('html-webpack-plugin')
+
+// add hot-reload related code to entry chunks
+Object.keys(baseWebpackConfig.entry).forEach(function (name) {
+  baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name])
+})
+
+module.exports = merge(baseWebpackConfig, {
+  module: {
+    loaders: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap })
+  },
+  // eval-source-map is faster for development
+  devtool: '#eval-source-map',
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env': config.dev.env
+    }),
+    // https://github.com/glenjamin/webpack-hot-middleware#installation--usage
+    new webpack.optimize.OccurenceOrderPlugin(),
+    new webpack.HotModuleReplacementPlugin(),
+    new webpack.NoErrorsPlugin(),
+    // https://github.com/ampedandwired/html-webpack-plugin
+    new HtmlWebpackPlugin({
+      filename: 'index.html',
+      template: 'index.html',
+      inject: true
+    })
+  ]
+})

+ 102 - 0
build/webpack.prod.conf.js

@@ -0,0 +1,102 @@
+var path = require('path')
+var config = require('../config')
+var utils = require('./utils')
+var webpack = require('webpack')
+var merge = require('webpack-merge')
+var baseWebpackConfig = require('./webpack.base.conf')
+var ExtractTextPlugin = require('extract-text-webpack-plugin')
+var HtmlWebpackPlugin = require('html-webpack-plugin')
+var env = process.env.NODE_ENV === 'testing'
+  ? require('../config/test.env')
+  : config.build.env
+
+var webpackConfig = merge(baseWebpackConfig, {
+  module: {
+    loaders: utils.styleLoaders({ sourceMap: config.build.productionSourceMap, extract: true })
+  },
+  devtool: config.build.productionSourceMap ? '#source-map' : false,
+  output: {
+    path: config.build.assetsRoot,
+    filename: utils.assetsPath('js/[name].[chunkhash].js'),
+    chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
+  },
+  vue: {
+    loaders: utils.cssLoaders({
+      sourceMap: config.build.productionSourceMap,
+      extract: true
+    })
+  },
+  plugins: [
+    // http://vuejs.github.io/vue-loader/en/workflow/production.html
+    new webpack.DefinePlugin({
+      'process.env': env
+    }),
+    new webpack.optimize.UglifyJsPlugin({
+      compress: {
+        warnings: false
+      }
+    }),
+    new webpack.optimize.OccurrenceOrderPlugin(),
+    // extract css into its own file
+    new ExtractTextPlugin(utils.assetsPath('css/[name].[contenthash].css')),
+    // generate dist index.html with correct asset hash for caching.
+    // you can customize output by editing /index.html
+    // see https://github.com/ampedandwired/html-webpack-plugin
+    new HtmlWebpackPlugin({
+      filename: process.env.NODE_ENV === 'testing'
+        ? 'index.html'
+        : config.build.index,
+      template: 'index.html',
+      inject: true,
+      minify: {
+        removeComments: true,
+        collapseWhitespace: true,
+        removeAttributeQuotes: true
+        // more options:
+        // https://github.com/kangax/html-minifier#options-quick-reference
+      },
+      // necessary to consistently work with multiple chunks via CommonsChunkPlugin
+      chunksSortMode: 'dependency'
+    }),
+    // split vendor js into its own file
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'vendor',
+      minChunks: function (module, count) {
+        // any required modules inside node_modules are extracted to vendor
+        return (
+          module.resource &&
+          /\.js$/.test(module.resource) &&
+          module.resource.indexOf(
+            path.join(__dirname, '../node_modules')
+          ) === 0
+        )
+      }
+    }),
+    // extract webpack runtime and module manifest to its own file in order to
+    // prevent vendor hash from being updated whenever app bundle is updated
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'manifest',
+      chunks: ['vendor']
+    })
+  ]
+})
+
+if (config.build.productionGzip) {
+  var CompressionWebpackPlugin = require('compression-webpack-plugin')
+
+  webpackConfig.plugins.push(
+    new CompressionWebpackPlugin({
+      asset: '[path].gz[query]',
+      algorithm: 'gzip',
+      test: new RegExp(
+        '\\.(' +
+        config.build.productionGzipExtensions.join('|') +
+        ')$'
+      ),
+      threshold: 10240,
+      minRatio: 0.8
+    })
+  )
+}
+
+module.exports = webpackConfig

+ 6 - 0
config/dev.env.js

@@ -0,0 +1,6 @@
+var merge = require('webpack-merge')
+var prodEnv = require('./prod.env')
+
+module.exports = merge(prodEnv, {
+  NODE_ENV: '"development"'
+})

+ 32 - 0
config/index.js

@@ -0,0 +1,32 @@
+// see http://vuejs-templates.github.io/webpack for documentation.
+var path = require('path')
+
+module.exports = {
+  build: {
+    env: require('./prod.env'),
+    index: path.resolve(__dirname, '../dist/index.html'),
+    assetsRoot: path.resolve(__dirname, '../dist'),
+    assetsSubDirectory: 'static',
+    assetsPublicPath: '/',
+    productionSourceMap: true,
+    // Gzip off by default as many popular static hosts such as
+    // Surge or Netlify already gzip all static assets for you.
+    // Before setting to `true`, make sure to:
+    // npm install --save-dev compression-webpack-plugin
+    productionGzip: false,
+    productionGzipExtensions: ['js', 'css']
+  },
+  dev: {
+    env: require('./dev.env'),
+    port: 8080,
+    assetsSubDirectory: 'static',
+    assetsPublicPath: '/',
+    proxyTable: {},
+    // CSS Sourcemaps off by default because relative paths are "buggy"
+    // with this option, according to the CSS-Loader README
+    // (https://github.com/webpack/css-loader#sourcemaps)
+    // In our experience, they generally work as expected,
+    // just be aware of this issue when enabling this option.
+    cssSourceMap: false
+  }
+}

+ 3 - 0
config/prod.env.js

@@ -0,0 +1,3 @@
+module.exports = {
+  NODE_ENV: '"production"'
+}

+ 6 - 0
config/test.env.js

@@ -0,0 +1,6 @@
+var merge = require('webpack-merge')
+var devEnv = require('./dev.env')
+
+module.exports = merge(devEnv, {
+  NODE_ENV: '"testing"'
+})

+ 19 - 0
index.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>NSBR</title>
+    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-default/index.css">
+    <style>
+    * {
+      font-family: 'Helvetica Neue', Helvetica, sans-serif;
+    }
+    </style>
+  </head>
+  <body>
+    <div id="app">
+      <router-view></router-view>
+    </div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

+ 66 - 0
npm-shrinkwrap.json

@@ -0,0 +1,66 @@
+{
+  "name": "vue2",
+  "version": "1.0.0",
+  "dependencies": {
+    "async-validator": {
+      "version": "1.6.7",
+      "from": "async-validator@>=1.6.6 <2.0.0",
+      "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-1.6.7.tgz"
+    },
+    "babel-helper-vue-jsx-merge-props": {
+      "version": "2.0.2",
+      "from": "babel-helper-vue-jsx-merge-props@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-2.0.2.tgz"
+    },
+    "deepmerge": {
+      "version": "1.3.1",
+      "from": "deepmerge@>=1.2.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.3.1.tgz"
+    },
+    "element-ui": {
+      "version": "1.0.7",
+      "from": "element-ui@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/element-ui/-/element-ui-1.0.7.tgz"
+    },
+    "throttle-debounce": {
+      "version": "1.0.1",
+      "from": "throttle-debounce@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-1.0.1.tgz"
+    },
+    "vue": {
+      "version": "2.1.6",
+      "from": "vue@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-2.1.6.tgz"
+    },
+    "vue-popup": {
+      "version": "0.2.12",
+      "from": "vue-popup@>=0.2.12 <0.3.0",
+      "resolved": "https://registry.npmjs.org/vue-popup/-/vue-popup-0.2.12.tgz"
+    },
+    "vue-resource": {
+      "version": "1.0.3",
+      "from": "vue-resource@latest",
+      "resolved": "https://registry.npmjs.org/vue-resource/-/vue-resource-1.0.3.tgz"
+    },
+    "vue-router": {
+      "version": "2.1.1",
+      "from": "vue-router@latest",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-2.1.1.tgz"
+    },
+    "vuex": {
+      "version": "2.0.0",
+      "from": "vuex@latest",
+      "resolved": "https://registry.npmjs.org/vuex/-/vuex-2.0.0.tgz"
+    },
+    "vuex-router-sync": {
+      "version": "4.0.1",
+      "from": "vuex-router-sync@latest",
+      "resolved": "https://registry.npmjs.org/vuex-router-sync/-/vuex-router-sync-4.0.1.tgz"
+    },
+    "wind-dom": {
+      "version": "0.0.3",
+      "from": "wind-dom@0.0.3",
+      "resolved": "https://registry.npmjs.org/wind-dom/-/wind-dom-0.0.3.tgz"
+    }
+  }
+}

+ 87 - 0
package.json

@@ -0,0 +1,87 @@
+{
+  "name": "vue2",
+  "version": "1.0.0",
+  "description": "A Vue.js project",
+  "author": "",
+  "private": true,
+  "scripts": {
+    "dev": "node build/dev-server.js",
+    "build": "node build/build.js",
+    "unit": "karma start test/unit/karma.conf.js --single-run",
+    "e2e": "node test/e2e/runner.js",
+    "test": "npm run unit && npm run e2e",
+    "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs"
+  },
+  "dependencies": {
+    "element-ui": "^1.0.3",
+    "vue": "^2.1.4",
+    "vue-resource": "^1.0.3",
+    "vue-router": "^2.1.1",
+    "vuex": "^2.0.0",
+    "vuex-router-sync": "^4.0.1"
+  },
+  "devDependencies": {
+    "autoprefixer": "^6.4.0",
+    "babel-core": "^6.0.0",
+    "babel-eslint": "^7.0.0",
+    "babel-loader": "^6.0.0",
+    "babel-plugin-transform-runtime": "^6.0.0",
+    "babel-preset-es2015": "^6.0.0",
+    "babel-preset-stage-2": "^6.0.0",
+    "babel-register": "^6.0.0",
+    "chalk": "^1.1.3",
+    "connect-history-api-fallback": "^1.1.0",
+    "css-loader": "^0.25.0",
+    "eslint": "^3.7.1",
+    "eslint-friendly-formatter": "^2.0.5",
+    "eslint-loader": "^1.5.0",
+    "eslint-plugin-html": "^1.3.0",
+    "eslint-config-standard": "^6.1.0",
+    "eslint-plugin-promise": "^2.0.1",
+    "eslint-plugin-standard": "^2.0.1",
+    "eventsource-polyfill": "^0.9.6",
+    "express": "^4.13.3",
+    "extract-text-webpack-plugin": "^1.0.1",
+    "file-loader": "^0.9.0",
+    "function-bind": "^1.0.2",
+    "html-webpack-plugin": "^2.8.1",
+    "http-proxy-middleware": "^0.17.2",
+    "json-loader": "^0.5.4",
+    "karma": "^1.3.0",
+    "karma-coverage": "^1.1.1",
+    "karma-mocha": "^1.2.0",
+    "karma-phantomjs-launcher": "^1.0.0",
+    "karma-sinon-chai": "^1.2.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-spec-reporter": "0.0.26",
+    "karma-webpack": "^1.7.0",
+    "lolex": "^1.4.0",
+    "mocha": "^3.1.0",
+    "chai": "^3.5.0",
+    "sinon": "^1.17.3",
+    "sinon-chai": "^2.8.0",
+    "inject-loader": "^2.0.1",
+    "isparta-loader": "^2.0.0",
+    "phantomjs-prebuilt": "^2.1.3",
+    "chromedriver": "^2.21.2",
+    "cross-spawn": "^4.0.2",
+    "nightwatch": "^0.9.8",
+    "selenium-server": "2.53.1",
+    "semver": "^5.3.0",
+    "opn": "^4.0.2",
+    "ora": "^0.3.0",
+    "shelljs": "^0.7.4",
+    "url-loader": "^0.5.7",
+    "vue-loader": "^10.0.0",
+    "vue-style-loader": "^1.0.0",
+    "vue-template-compiler": "^2.1.0",
+    "webpack": "^1.13.2",
+    "webpack-dev-middleware": "^1.8.3",
+    "webpack-hot-middleware": "^2.12.2",
+    "webpack-merge": "^0.14.1"
+  },
+  "engines": {
+    "node": ">= 4.0.0",
+    "npm": ">= 3.0.0"
+  }
+}

+ 28 - 0
src/App.vue

@@ -0,0 +1,28 @@
+<template>
+  <div id="app">
+    <img src="./assets/logo.png">
+    <hello></hello>
+  </div>
+</template>
+
+<script>
+import Hello from './components/Hello'
+
+export default {
+  name: 'app',
+  components: {
+    Hello
+  }
+}
+</script>
+
+<style>
+#app {
+  font-family: 'Avenir', Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+  margin-top: 60px;
+}
+</style>

+ 15 - 0
src/main.js

@@ -0,0 +1,15 @@
+import Vue from 'vue'
+import router from './router'
+import store from './vuex/store'
+import { sync } from 'vuex-router-sync'
+import Element from 'element-ui'
+
+Vue.use(Element)
+
+sync(store, router)
+
+/* eslint-disable no-new */
+new Vue({
+  store,
+  router
+}).$mount('#app')

+ 137 - 0
src/pages/index.vue

@@ -0,0 +1,137 @@
+<template>
+  <el-table :data="SysDevices" :height="heightView" border :row-class-name="tableRowClassName">
+    <el-table-column prop="Msg.id" label="编号" width="120" fixed>
+    </el-table-column>
+    <el-table-column label="数值">
+      <el-table-column prop="Msg.attr.value.0" label="1" width="80">
+      </el-table-column>
+      <el-table-column prop="Msg.attr.value.1" label="2" width="80">
+      </el-table-column>
+      <el-table-column prop="Msg.attr.value.2" label="3" width="80">
+      </el-table-column>
+    </el-table-column>
+    <el-table-column label="参数">
+      <el-table-column prop="Msg.attr.parameter.0" label="1" width="80">
+      </el-table-column>
+      <el-table-column prop="Msg.attr.parameter.1" label="2" width="80">
+      </el-table-column>
+      <el-table-column prop="Msg.attr.parameter.2" label="3" width="80">
+      </el-table-column>
+    </el-table-column>
+    <el-table-column prop="Msg.attr.time_get" label="时间">
+    </el-table-column>
+  </el-table>
+</template>
+<script>
+export default {
+  name: 'LoginPage',
+  data() {
+    return {
+      login: {
+        name: '',
+        password: ''
+      },
+      identifiers: {
+        name: 'Kennung',
+        password: 'Password',
+        submit: 'Login'
+      },
+      SysDevices: [],
+      SysDeviceIds: [],
+      BlinkIndex: -1,
+      heightView: 800
+    }
+  },
+  mounted: function() {
+    this.$nextTick(function() {
+      this.heightView = document.body.clientHeight - 150
+      this.initWebSocket()
+    })
+  },
+  methods: {
+    submit() {
+      console.log('submitted login click')
+    },
+    tableRowClassName(row, index) {
+      if (index === this.BlinkIndex) {
+        return 'positive-row'
+      }
+      return ''
+    },
+    initWebSocket() {
+      let socket
+      let timerLinker
+      if (window.WebSocket) {
+        if (socket == null) {
+          socket = new window.WebSocket('ws://cb.sunqida.cn:6006/ws/join')
+        } else {
+          return
+        }
+        console.log('始初化通信')
+        let vue = this
+        socket.onmessage = function(event) {
+          if (event.data) {
+            try {
+              let jsonModel = JSON.parse(event.data)
+                // console.log('接收:%o', jsonModel)
+              switch (jsonModel.Type) {
+                case 1:
+                  let index = vue.SysDeviceIds.indexOf(jsonModel.Msg.id)
+                  if (index === -1) {
+                    vue.SysDevices.push(jsonModel)
+                    vue.SysDeviceIds.push(jsonModel.Msg.id)
+                    vue.BlinkIndex = 0
+                  } else {
+                    // vue.SysDevices[index] = jsonModel // 与id集共用一个index,可能会出问题
+                    vue.SysDevices.splice(index, 1, jsonModel)
+                    vue.BlinkIndex = index
+                  }
+                  break
+                case 0:
+                  console.info('注册成功:%o', jsonModel)
+                  break
+                default:
+              }
+            } catch (e) {
+              console.error('json转换:%s', e)
+            } finally {
+              //
+            }
+          }
+        }
+        socket.onopen = function(event) {
+          console.log('Web Socket opened!')
+          clearInterval(timerLinker)
+          let data = {
+            Id: Math.round(Math.random() * 100000),
+            Name: 'user1',
+            Token: 'token123',
+            UpTime: new Date()
+          }
+          console.log('请求注册: %o', data)
+          socket.send(JSON.stringify(data))
+        }
+        socket.onclose = function(event) {
+          console.log(`Web Socket closed :${event}`)
+          socket = null
+          timerLinker = setTimeout(vue.initWebSocket(), 10000)
+        }
+        socket.onerror = function(event) {
+          console.log(`Web Socket error :${event}`)
+        }
+      } else {
+        console.log('Your browser does not support Web Socket.')
+      }
+    }
+  }
+}
+</script>
+<style>
+.el-table .info-row {
+  background: #c9e5f5;
+}
+
+.el-table .positive-row {
+  background: #e2f0e4;
+}
+</style>

+ 14 - 0
src/router.js

@@ -0,0 +1,14 @@
+import Vue from 'vue'
+import VueRouter from 'vue-router'
+import Index from './pages/Index'
+
+Vue.use(VueRouter)
+
+const routes = [
+  {path: '/index', component: Index},
+  {path: '*', redirect: '/index'}
+]
+
+export default new VueRouter({
+  routes
+})

+ 15 - 0
src/vuex/store.js

@@ -0,0 +1,15 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+
+Vue.use(Vuex)
+
+const state = {
+  version: '0.0.1'
+}
+
+const mutations = {}
+
+export default new Vuex.Store({
+  state,
+  mutations
+})

+ 0 - 0
static/.gitkeep


+ 1 - 0
static/log

@@ -0,0 +1 @@
+

+ 26 - 0
test/e2e/custom-assertions/elementCount.js

@@ -0,0 +1,26 @@
+// A custom Nightwatch assertion.
+// the name of the method is the filename.
+// can be used in tests like this:
+//
+//   browser.assert.elementCount(selector, count)
+//
+// for how to write custom assertions see
+// http://nightwatchjs.org/guide#writing-custom-assertions
+exports.assertion = function (selector, count) {
+  this.message = 'Testing if element <' + selector + '> has count: ' + count
+  this.expected = count
+  this.pass = function (val) {
+    return val === this.expected
+  }
+  this.value = function (res) {
+    return res.value
+  }
+  this.command = function (cb) {
+    var self = this
+    return this.api.execute(function (selector) {
+      return document.querySelectorAll(selector).length
+    }, [selector], function (res) {
+      cb.call(self, res)
+    })
+  }
+}

+ 46 - 0
test/e2e/nightwatch.conf.js

@@ -0,0 +1,46 @@
+require('babel-register')
+var config = require('../../config')
+
+// http://nightwatchjs.org/guide#settings-file
+module.exports = {
+  "src_folders": ["test/e2e/specs"],
+  "output_folder": "test/e2e/reports",
+  "custom_assertions_path": ["test/e2e/custom-assertions"],
+
+  "selenium": {
+    "start_process": true,
+    "server_path": "node_modules/selenium-server/lib/runner/selenium-server-standalone-2.53.1.jar",
+    "host": "127.0.0.1",
+    "port": 4444,
+    "cli_args": {
+      "webdriver.chrome.driver": require('chromedriver').path
+    }
+  },
+
+  "test_settings": {
+    "default": {
+      "selenium_port": 4444,
+      "selenium_host": "localhost",
+      "silent": true,
+      "globals": {
+        "devServerURL": "http://localhost:" + (process.env.PORT || config.dev.port)
+      }
+    },
+
+    "chrome": {
+      "desiredCapabilities": {
+        "browserName": "chrome",
+        "javascriptEnabled": true,
+        "acceptSslCerts": true
+      }
+    },
+
+    "firefox": {
+      "desiredCapabilities": {
+        "browserName": "firefox",
+        "javascriptEnabled": true,
+        "acceptSslCerts": true
+      }
+    }
+  }
+}

+ 31 - 0
test/e2e/runner.js

@@ -0,0 +1,31 @@
+// 1. start the dev server using production config
+process.env.NODE_ENV = 'testing'
+var server = require('../../build/dev-server.js')
+
+// 2. run the nightwatch test suite against it
+// to run in additional browsers:
+//    1. add an entry in test/e2e/nightwatch.conf.json under "test_settings"
+//    2. add it to the --env flag below
+// or override the environment flag, for example: `npm run e2e -- --env chrome,firefox`
+// For more information on Nightwatch's config file, see
+// http://nightwatchjs.org/guide#settings-file
+var opts = process.argv.slice(2)
+if (opts.indexOf('--config') === -1) {
+  opts = opts.concat(['--config', 'test/e2e/nightwatch.conf.js'])
+}
+if (opts.indexOf('--env') === -1) {
+  opts = opts.concat(['--env', 'chrome'])
+}
+
+var spawn = require('cross-spawn')
+var runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' })
+
+runner.on('exit', function (code) {
+  server.close()
+  process.exit(code)
+})
+
+runner.on('error', function (err) {
+  server.close()
+  throw err
+})

+ 19 - 0
test/e2e/specs/test.js

@@ -0,0 +1,19 @@
+// For authoring Nightwatch tests, see
+// http://nightwatchjs.org/guide#usage
+
+module.exports = {
+  'default e2e tests': function (browser) {
+    // automatically uses dev Server port from /config.index.js
+    // default: http://localhost:8080
+    // see nightwatch.conf.js
+    const devServer = browser.globals.devServerURL
+
+    browser
+      .url(devServer)
+      .waitForElementVisible('#app', 5000)
+      .assert.elementPresent('.hello')
+      .assert.containsText('h1', 'Welcome to Your Vue.js App')
+      .assert.elementCount('img', 1)
+      .end()
+  }
+}

+ 9 - 0
test/unit/.eslintrc

@@ -0,0 +1,9 @@
+{
+  "env": {
+    "mocha": true
+  },
+  "globals": {
+    "expect": true,
+    "sinon": true
+  }
+}

+ 13 - 0
test/unit/index.js

@@ -0,0 +1,13 @@
+// Polyfill fn.bind() for PhantomJS
+/* eslint-disable no-extend-native */
+Function.prototype.bind = require('function-bind')
+
+// require all test files (files that ends with .spec.js)
+const testsContext = require.context('./specs', true, /\.spec$/)
+testsContext.keys().forEach(testsContext)
+
+// require all src files except main.js for coverage.
+// you can also change this to match only the subset of files that
+// you want coverage for.
+const srcContext = require.context('../../src', true, /^\.\/(?!main(\.js)?$)/)
+srcContext.keys().forEach(srcContext)

+ 75 - 0
test/unit/karma.conf.js

@@ -0,0 +1,75 @@
+// This is a karma config file. For more details see
+//   http://karma-runner.github.io/0.13/config/configuration-file.html
+// we are also using it with karma-webpack
+//   https://github.com/webpack/karma-webpack
+
+var path = require('path')
+var merge = require('webpack-merge')
+var baseConfig = require('../../build/webpack.base.conf')
+var utils = require('../../build/utils')
+var webpack = require('webpack')
+var projectRoot = path.resolve(__dirname, '../../')
+
+var webpackConfig = merge(baseConfig, {
+  // use inline sourcemap for karma-sourcemap-loader
+  module: {
+    loaders: utils.styleLoaders()
+  },
+  devtool: '#inline-source-map',
+  vue: {
+    loaders: {
+      js: 'isparta'
+    }
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env': require('../../config/test.env')
+    })
+  ]
+})
+
+// no need for app entry during tests
+delete webpackConfig.entry
+
+// make sure isparta loader is applied before eslint
+webpackConfig.module.preLoaders = webpackConfig.module.preLoaders || []
+webpackConfig.module.preLoaders.unshift({
+  test: /\.js$/,
+  loader: 'isparta',
+  include: path.resolve(projectRoot, 'src')
+})
+
+// only apply babel for test files when using isparta
+webpackConfig.module.loaders.some(function (loader, i) {
+  if (loader.loader === 'babel') {
+    loader.include = path.resolve(projectRoot, 'test/unit')
+    return true
+  }
+})
+
+module.exports = function (config) {
+  config.set({
+    // to run in additional browsers:
+    // 1. install corresponding karma launcher
+    //    http://karma-runner.github.io/0.13/config/browsers.html
+    // 2. add it to the `browsers` array below.
+    browsers: ['PhantomJS'],
+    frameworks: ['mocha', 'sinon-chai'],
+    reporters: ['spec', 'coverage'],
+    files: ['./index.js'],
+    preprocessors: {
+      './index.js': ['webpack', 'sourcemap']
+    },
+    webpack: webpackConfig,
+    webpackMiddleware: {
+      noInfo: true
+    },
+    coverageReporter: {
+      dir: './coverage',
+      reporters: [
+        { type: 'lcov', subdir: '.' },
+        { type: 'text-summary' }
+      ]
+    }
+  })
+}

+ 13 - 0
test/unit/specs/Hello.spec.js

@@ -0,0 +1,13 @@
+import Vue from 'vue'
+import Hello from 'src/components/Hello'
+
+describe('Hello.vue', () => {
+  it('should render correct contents', () => {
+    const vm = new Vue({
+      el: document.createElement('div'),
+      render: (h) => h(Hello)
+    })
+    expect(vm.$el.querySelector('.hello h1').textContent)
+      .to.equal('Welcome to Your Vue.js App')
+  })
+})