hello world

we-mid · Feb 19, 2016 · a93242f · fritx · Mar 8, 2016 · a93242f
commit a93242f
Show file tree

Hide file tree

Showing 13 changed files with 295 additions and 0 deletions.
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,11 @@
+{
+  "presets": [
+    "es2015",
+    "stage-0",
+    "react",
+    "async-to-bluebird"
+  ],
+  "plugins": [
+    "transform-decorators-legacy"
+  ]
+}
diff --git a/.eslintrc b/.eslintrc
@@ -0,0 +1,34 @@
+{
+  "extends": ["rackt", "xo-react"],
+  "env": {
+    "browser": true,
+    "node": true,
+    "mocha": true
+  },
+  "rules": {
+    "eol-last": 1,
+    "valid-jsdoc": 0,
+    "indent": 1,
+    "semi": 1,
+    "strict": [1, "global"],
+    "no-console": 0,
+    "no-unused-vars": 1,
+    "comma-dangle": [1, "always-multiline"],
+    "array-bracket-spacing": 1,
+    "object-curly-spacing": 1,
+    "no-multiple-empty-lines": 1,
+    "react/prop-types": 0,
+    "react/self-closing-comp": 1,
+    "react/jsx-boolean-value": 1,
+    "react/jsx-key": 1,
+    "react/jsx-indent": [1, 2],
+    "react/jsx-indent-props": [1, 2],
+    "react/jsx-closing-bracket-location": [1, "after-props"],
+    "react/jsx-uses-react": 1,
+    "react/jsx-no-undef": 2,
+    "react/wrap-multilines": 2
+  },
+  "plugins": [
+    "react"
+  ]
+}
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+node_modules
+dist
+*.log
diff --git a/package.json b/package.json
@@ -0,0 +1,45 @@
+{
+  "name": "os-web",
+  "version": "0.0.0",
+  "main": "dist/server",
+  "scripts": {
+    "web": "webpack -w --progress --config task/webpack.web",
+    "web.prod": "webpack -w --progress --config task/webpack.web.prod",
+    "server": "webpack -w --progress --config task/webpack.server",
+    "start": "nodemon --exec node ."
+  },
+  "devDependencies": {
+    "babel-core": "^6.5.2",
+    "babel-eslint": "^5.0.0",
+    "babel-loader": "^6.2.3",
+    "babel-plugin-transform-decorators-legacy": "^1.3.4",
+    "babel-preset-async-to-bluebird": "^1.0.0",
+    "babel-preset-es2015": "^6.5.0",
+    "babel-preset-react": "^6.5.0",
+    "babel-preset-stage-0": "^6.5.0",
+    "css-loader": "^0.23.1",
+    "eslint": "^2.1.0",
+    "eslint-config-rackt": "^1.1.1",
+    "eslint-config-xo-react": "^0.4.0",
+    "eslint-loader": "^1.3.0",
+    "eslint-plugin-react": "^3.16.1",
+    "npm-install-webpack-plugin": "^2.0.2",
+    "react": "^0.14.7",
+    "react-dom": "^0.14.7",
+    "react-tap-event-plugin": "^0.2.2",
+    "style-loader": "^0.13.0",
+    "webpack": "^1.12.13",
+    "webpack-notifier": "^1.2.1"
+  },
+  "dependencies": {
+    "babel-polyfill": "^6.5.0",
+    "bluebird": "^3.3.1",
+    "koa": "^2.0.0-alpha.3",
+    "koa-convert": "^1.2.0",
+    "koa-logger": "^2.0.0",
+    "koa-mount": "^1.3.0",
+    "koa-router": "^7.0.1",
+    "koa-static": "^2.0.0",
+    "lodash": "^4.5.0"
+  }
+}
diff --git a/src/server/index.js b/src/server/index.js
@@ -0,0 +1,2 @@
+
+export * from './server'
diff --git a/src/server/server.js b/src/server/server.js
@@ -0,0 +1,37 @@
+/* global rootDir */
+import 'babel-polyfill'
+import fs from 'fs'
+import { resolve } from 'path'
+import Koa from 'koa'
+import Router from 'koa-router'
+import mount from 'koa-mount'
+import serve from 'koa-static'
+import logger from 'koa-logger'
+import convert from 'koa-convert'
+import { promisify } from 'bluebird'
+
+let read = promisify(fs.readFile)
+let app = new Koa()
+let router = new Router()
+
+// koa v2 app.use migration
+// https://github.com/koajs/convert#migration
+let _use = app.use
+app.use = x => _use.call(app, convert(x))
+
+router.get('/', async (ctx) => {
+  ctx.type = 'html'
+  ctx.body = await read(resolve(rootDir, 'src/web/index.html'))
+})
+
+app.use(logger())
+app.use(router.routes())
+app.use(mount('/web', serve(resolve(rootDir, 'dist/web'))))
+
+let port = 9774
+app.listen(port, (err) => {
+  if (err) throw err
+  console.log(`markppt server started on ${port}`)
+})
+
+export default app
diff --git a/src/web/App.css b/src/web/App.css
diff --git a/src/web/App.js b/src/web/App.js
@@ -0,0 +1,11 @@
+
+import React, { Component } from 'react'
+
+export default class App extends Component {
+
+  render() {
+    return (
+      <h1>Hello World</h1>
+    )
+  }
+}
diff --git a/src/web/index.html b/src/web/index.html
@@ -0,0 +1,11 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Markppt Site</title>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="web/index.js"></script>
+  </body>
+</html>
diff --git a/src/web/index.js b/src/web/index.js
@@ -0,0 +1,12 @@
+
+import React from 'react'
+import { render } from 'react-dom'
+import injectTapEventPlugin from 'react-tap-event-plugin'
+import App from './App'
+import './App.css'
+
+
+injectTapEventPlugin()
+
+let root = document.getElementById('root')
+render(<App />, root)
diff --git a/task/webpack.server.js b/task/webpack.server.js
@@ -0,0 +1,57 @@
+'use strict'
+const resolve = require('path').resolve
+const webpack = require('webpack')
+const NpmInstallPlugin = require('npm-install-webpack-plugin')
+const NotifierPlugin = require('webpack-notifier')
+const serverDir = resolve(__dirname, '../src/server')
+
+module.exports = {
+
+  target: 'node',
+
+  entry: {
+    'index.js': './src/server/index.js',
+  },
+
+  // 不知道server 如何使用sourcemap
+  // devtool: 'cheap-module-source-map',
+
+  output: {
+    pathinfo: true,
+    path: 'dist/server',
+    filename: '[name]',
+    sourceMapFilename: '[name].map',
+  },
+
+  module: {
+    preLoaders: [
+      { test: /\.js$/, include: serverDir, loader: 'eslint' },
+    ],
+    loaders: [
+      { test: /\.json$/, include: serverDir, loader: 'json' },
+      { test: /\.js$/, include: serverDir, loader: 'babel' },
+    ],
+  },
+
+  resolve: {
+    extensions: ['', '.js'],
+    packageMains: ['webpack', 'browser', 'web', 'browserify', ['jam', 'main'], 'main'],
+  },
+
+  externals: [
+    (ctx, req,  cb) => {
+      // if (resolve(ctx, req).indexOf(serverDir) !== 0) return cb()
+      if (/^\.\//.test(req)) return cb()
+      cb(null, `commonjs ${req}`)
+    },
+  ],
+
+  plugins: [
+    new NpmInstallPlugin({ save: true }),
+    new NotifierPlugin({ alwaysNotify: true }),
+    new webpack.NoErrorsPlugin(),
+    new webpack.DefinePlugin({
+      rootDir: `"${resolve(__dirname, '..')}"`,
+    }),
+  ],
+}
diff --git a/task/webpack.web.js b/task/webpack.web.js
@@ -0,0 +1,54 @@
+'use strict'
+const resolve = require('path').resolve
+const webpack = require('webpack')
+const NpmInstallPlugin = require('npm-install-webpack-plugin')
+const NotifierPlugin = require('webpack-notifier')
+const webDir = resolve(__dirname, '../src/web')
+
+module.exports = {
+
+  entry: {
+    'index.js': './src/web/index.js',
+  },
+
+  devtool: 'cheap-module-source-map',
+
+  output: {
+    pathinfo: true,
+    path: 'dist/web',
+    filename: '[name]',
+    sourceMapFilename: '[name].map',
+  },
+
+  module: {
+    preLoaders: [
+      { test: /\.js$/, include: webDir, loader: 'eslint' },
+    ],
+    loaders: [
+      { test: /\.js$/, include: webDir, loader: 'babel' },
+      { test: /\.css$/, loader: 'style!css' },
+      { test: /\.(svg|eot|ttf|woff|woff2)(\?.+)?$/, loader: 'url' },
+    ],
+  },
+
+  resolve: {
+    // 和material-ui冲突了
+    // alias: {
+    //   'react': 'react-lite',
+    //   'react-dom': 'react-lite',
+    // },
+    extensions: ['', '.js'],
+    packageMains: ['webpack', 'browser', 'web', 'browserify', ['jam', 'main'], 'main', 'style'],
+  },
+
+  plugins: [
+    new NpmInstallPlugin({ save: true }),
+    new NotifierPlugin({ alwaysNotify: true }),
+    new webpack.NoErrorsPlugin(),
+    new webpack.DefinePlugin({
+      'process.env': {
+        'NODE_ENV': `"development"`
+      }
+    }),
+  ],
+}
diff --git a/task/webpack.web.prod.js b/task/webpack.web.prod.js
@@ -0,0 +1,18 @@
+const webpack = require('webpack')
+const base = require('./webpack.web')
+
+module.exports = Object.assign({}, base, {
+  plugins: base.plugins.concat([
+    new webpack.DefinePlugin({
+      'process.env': {
+        'NODE_ENV': `"production"`
+      }
+    }),
+    new webpack.optimize.UglifyJsPlugin({
+      compressor: {
+        screw_ie8: true,
+        warnings: false
+      }
+    }),
+  ]),
+})