From a93242fe04fc267776d29a67a05eed8a2b2e9608 Mon Sep 17 00:00:00 2001 From: Fritz Lin Date: Fri, 19 Feb 2016 22:16:13 +0800 Subject: [PATCH] hello world --- .babelrc | 11 ++++++++ .eslintrc | 34 ++++++++++++++++++++++++ .gitignore | 3 +++ package.json | 45 +++++++++++++++++++++++++++++++ src/server/index.js | 2 ++ src/server/server.js | 37 ++++++++++++++++++++++++++ src/web/App.css | 0 src/web/App.js | 11 ++++++++ src/web/index.html | 11 ++++++++ src/web/index.js | 12 +++++++++ task/webpack.server.js | 57 ++++++++++++++++++++++++++++++++++++++++ task/webpack.web.js | 54 +++++++++++++++++++++++++++++++++++++ task/webpack.web.prod.js | 18 +++++++++++++ 13 files changed, 295 insertions(+) create mode 100644 .babelrc create mode 100644 .eslintrc create mode 100644 .gitignore create mode 100644 package.json create mode 100644 src/server/index.js create mode 100644 src/server/server.js create mode 100644 src/web/App.css create mode 100644 src/web/App.js create mode 100644 src/web/index.html create mode 100644 src/web/index.js create mode 100644 task/webpack.server.js create mode 100644 task/webpack.web.js create mode 100644 task/webpack.web.prod.js diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..77609c7 --- /dev/null +++ b/.babelrc @@ -0,0 +1,11 @@ +{ + "presets": [ + "es2015", + "stage-0", + "react", + "async-to-bluebird" + ], + "plugins": [ + "transform-decorators-legacy" + ] +} diff --git a/.eslintrc b/.eslintrc new file mode 100644 index 0000000..a818a75 --- /dev/null +++ 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 new file mode 100644 index 0000000..d4d7e3f --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +node_modules +dist +*.log diff --git a/package.json b/package.json new file mode 100644 index 0000000..90092ea --- /dev/null +++ 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 new file mode 100644 index 0000000..2dd4ef2 --- /dev/null +++ b/src/server/index.js @@ -0,0 +1,2 @@ + +export * from './server' diff --git a/src/server/server.js b/src/server/server.js new file mode 100644 index 0000000..1aaa54b --- /dev/null +++ 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 new file mode 100644 index 0000000..e69de29 diff --git a/src/web/App.js b/src/web/App.js new file mode 100644 index 0000000..b57bc3e --- /dev/null +++ b/src/web/App.js @@ -0,0 +1,11 @@ + +import React, { Component } from 'react' + +export default class App extends Component { + + render() { + return ( +

Hello World

+ ) + } +} diff --git a/src/web/index.html b/src/web/index.html new file mode 100644 index 0000000..84d0dea --- /dev/null +++ b/src/web/index.html @@ -0,0 +1,11 @@ + + + + Markppt Site + + + +
+ + + diff --git a/src/web/index.js b/src/web/index.js new file mode 100644 index 0000000..9262f82 --- /dev/null +++ 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(, root) diff --git a/task/webpack.server.js b/task/webpack.server.js new file mode 100644 index 0000000..61e8a4e --- /dev/null +++ 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 new file mode 100644 index 0000000..1caac21 --- /dev/null +++ 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 new file mode 100644 index 0000000..805280c --- /dev/null +++ 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 + } + }), + ]), +})