alibaba · Orange-C · Aug 6, 2019 · Jul 31, 2019 · Aug 1, 2019 · Aug 1, 2019
diff --git a/packages/rax-cli/src/generator/app/_package.json b/packages/rax-cli/src/generator/app/_package.json
@@ -12,6 +12,9 @@
     "driver-universal": "^1.0.1",
     "history": "^4.9.0",
     "rax": "^1.0.8",
+    <%_ if (projectTargets.includes('web')) { -%>
+    "rax-pwa": "^1.0.2",
+    <%_ } -%>
     "rax-view": "^1.0.0",
     "rax-text": "^1.0.0",
     "universal-app-runtime": "^0.1.3"

diff --git a/packages/rax-cli/src/generator/app/build.json b/packages/rax-cli/src/generator/app/build.json
@@ -1,5 +1,8 @@
 <%_ const isSSR = projectFeatures.includes('ssr') -%>
 {
+  <%_ if (isSSR) { -%>
+  "inlineStyle": true,
+  <%_ } -%>
   "plugins": [
     ["rax-plugin-app", { "targets": ["<%- projectTargets.join('", "') %>"]}]<%_ if (isSSR) { -%>,<%_ } %>
     <%_ if (isSSR) { -%>

diff --git a/packages/rax-cli/src/generator/app/src/app.json b/packages/rax-cli/src/generator/app/src/app.json
@@ -1,3 +1,4 @@
+<%_ const isSSR = projectFeatures.includes('ssr') -%>
 {
   "routes": [
     {
@@ -9,6 +10,9 @@
       "component": "pages/about"
     }
   ],
+  <%_ if (isSSR) { -%>
+  "historyType": "browser",
+  <%_ } -%>
   "window": {
     "defaultTitle": "Rax App 1.0"
   }

diff --git a/packages/rax-cli/src/generator/app/src/document/index.jsx b/packages/rax-cli/src/generator/app/src/document/index.jsx
@@ -14,14 +14,13 @@ function Document(props) {
         <meta charset="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, minimum-scale=1, user-scalable=no" />
         <title>WebApp</title>
-        <link href={`${publicPath}web/index.css`} rel="stylesheet" />
       </head>
       <body>
         {/* root container */}
         <div id="root" dangerouslySetInnerHTML={{ __html: initialHtml || '' }} />
-        <script src={`${publicPath}web/index.js`} />
         {/* initial data from server side */}
-        <script data-from="server" type="application/json" dangerouslySetInnerHTML={{__html: initialData}} />
+        <script data-from="server" dangerouslySetInnerHTML={{__html: 'window.__INITIAL_DATA__=' + initialData}} />
+        <script src={`${publicPath}web/index.js`} />
       </body>
     </html>
   );
@@ -36,7 +35,6 @@ function Document(props) {
         <meta charset="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, minimum-scale=1, user-scalable=no" />
         <title>WebApp</title>
-        <link href={`${publicPath}web/index.css`} rel="stylesheet" />
       </head>
       <body>
         {/* root container */}

diff --git a/packages/rax-plugin-app/src/config/web/getBase.js b/packages/rax-plugin-app/src/config/web/getBase.js
@@ -1,4 +1,5 @@
 'use strict';
+const path = require('path');
 const webpack = require('webpack');
 const serverRender = require('rax-server-renderer');
 const babelMerge = require('babel-merge');
@@ -16,7 +17,7 @@ const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
 const getWebpackBase = require('../getWebpackBase');
 
 module.exports = (context) => {
-  const { rootDir } = context;
+  const { rootDir, userConfig } = context;
 
   const config = getWebpackBase(context);
 
@@ -27,28 +28,20 @@ module.exports = (context) => {
     .set('@core/page', 'universal-app-runtime')
     .set('@core/router', 'universal-app-runtime');
 
-  config.module.rule('jsx')
-    .test(/\.(js|mjs|jsx)$/)
-    .exclude
-      .add(/(node_modules|bower_components)/)
-      .end()
-    .use('babel')
-      .loader(require.resolve('babel-loader'))
-      .options(babelConfigWeb);
-
-  config.module.rule('tsx')
-    .test(/\.tsx?$/)
-    .exclude
-      .add(/(node_modules|bower_components)/)
-      .end()
-    .use('babel')
-      .loader(require.resolve('babel-loader'))
-      .options(babelConfigWeb)
-      .end()
-    .use('ts')
-      .loader(require.resolve('ts-loader'));
+  let babelConfig = babelConfigWeb;
+  if (userConfig.inlineStyle) {
+    babelConfig = babelMerge.all([{
+      plugins: [
+        require.resolve('babel-plugin-transform-jsx-stylesheet')
+      ],
+    }, babelConfig]);
 
-  config.module.rule('css')
+    config.module.rule('css')
+    .test(/\.css?$/)
+    .use('css')
+      .loader(require.resolve('stylesheet-loader'));
+  } else {
+    config.module.rule('css')
     .test(/\.css?$/)
     .use('minicss')
       .loader(MiniCssExtractPlugin.loader)
@@ -71,6 +64,34 @@ module.exports = (context) => {
         ],
       });
 
+    config.plugin('minicss')
+    .use(MiniCssExtractPlugin, [{
+      filename: 'web/[name].css',
+      chunkFilename: 'web/[name].css',
+    }]);
+  }
+
+  config.module.rule('jsx')
+  .test(/\.(js|mjs|jsx)$/)
+  .exclude
+    .add(/(node_modules|bower_components)/)
+    .end()
+  .use('babel')
+    .loader(require.resolve('babel-loader'))
+    .options(babelConfig);
+
+  config.module.rule('tsx')
+  .test(/\.tsx?$/)
+  .exclude
+    .add(/(node_modules|bower_components)/)
+    .end()
+  .use('babel')
+    .loader(require.resolve('babel-loader'))
+    .options(babelConfig)
+    .end()
+  .use('ts')
+    .loader(require.resolve('ts-loader'));
+
   config.module.rule('assets')
     .test(/\.(svg|png|webp|jpe?g|gif)$/i)
     .use('source')
@@ -95,12 +116,6 @@ module.exports = (context) => {
       render: serverRender.renderToString,
     }]);
 
-  config.plugin('minicss')
-    .use(MiniCssExtractPlugin, [{
-      filename: 'web/[name].css',
-      chunkFilename: 'web/[id].css',
-    }]);
-
   config.plugin('noError')
     .use(webpack.NoEmitOnErrorsPlugin);
 

diff --git a/packages/rax-plugin-app/src/config/web/setDev.js b/packages/rax-plugin-app/src/config/web/setDev.js
@@ -25,6 +25,7 @@ module.exports = (config, context) => {
     .contentBase(path.resolve(rootDir, 'build'))
     .watchContentBase(true)
     .hot(true)
+    .quiet(true)
     .publicPath(publicPath)
     .overlay(false)
     .host(address.ip())

diff --git a/packages/rax-plugin-app/src/config/weex/setDev.js b/packages/rax-plugin-app/src/config/weex/setDev.js
@@ -25,6 +25,7 @@ module.exports = (config, context) => {
     .contentBase(path.resolve(rootDir, 'build'))
     .watchContentBase(true)
     .hot(true)
+    .quiet(true)
     .publicPath(publicPath)
     .overlay(false)
     .host(address.ip())

diff --git a/packages/rax-plugin-app/src/index.js b/packages/rax-plugin-app/src/index.js
@@ -4,7 +4,7 @@ const defaultUserConfig = require('./config/defaultUserConfig');
 const build = require('./build');
 const dev = require('./dev');
 
-module.exports = (api, options) => {
+const pluginApp = (api, options) => {
   const { context } = api;
   const { command } = context;
   // set default config
@@ -18,3 +18,13 @@ module.exports = (api, options) => {
     dev(api, options);
   }
 };
+
+pluginApp.getWebBase = require('./config/web/getBase');
+pluginApp.setWebDev = require('./config/web/setDev');
+pluginApp.setWebBuild = require('./config/web/setBuild');
+
+pluginApp.getWeexBase = require('./config/weex/getBase');
+pluginApp.setWeexDev = require('./config/weex/setDev');
+pluginApp.setWeexBuild = require('./config/weex/setBuild');
+
+module.exports = pluginApp;
diff --git a/packages/rax-plugin-ssr/package.json b/packages/rax-plugin-ssr/package.json
@@ -0,0 +1,48 @@
+{
+  "name": "rax-plugin-ssr",
+  "version": "0.1.0-0",
+  "description": "rax ssr plugins",
+  "license": "BSD-3-Clause",
+  "main": "src/index.js",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/alibaba/rax.git"
+  },
+  "bugs": {
+    "url": "https://github.com/alibaba/rax/issues"
+  },
+  "homepage": "https://github.com/alibaba/rax#readme",
+  "dependencies": {
+    "@babel/core": "7.2.0",
+    "@babel/plugin-proposal-class-properties": "7.2.0",
+    "@babel/plugin-proposal-decorators": "7.2.0",
+    "@babel/plugin-proposal-export-default-from": "7.2.0",
+    "@babel/plugin-proposal-export-namespace-from": "^7.0.0",
+    "@babel/plugin-proposal-function-bind": "^7.2.0",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
+    "@babel/plugin-proposal-optional-chaining": "^7.0.0",
+    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
+    "@babel/plugin-transform-runtime": "^7.2.0",
+    "@babel/preset-env": "7.2.0",
+    "@babel/preset-flow": "7.0.0",
+    "@babel/preset-react": "7.0.0",
+    "@babel/runtime": "^7.2.0",
+    "address": "^1.0.1",
+    "autoprefixer": "^9.4.3",
+    "babel-loader": "8.0.4",
+    "babel-merge": "^3.0.0",
+    "babel-plugin-transform-jsx-class": "^0.1.2",
+    "babel-plugin-transform-jsx-condition": "^0.1.0",
+    "babel-plugin-transform-jsx-fragment": "^0.1.1",
+    "babel-plugin-transform-jsx-list": "^0.1.0",
+    "babel-plugin-transform-jsx-memo": "^0.1.2",
+    "babel-plugin-transform-jsx-slot": "^0.1.1",
+    "babel-plugin-transform-jsx-stylesheet": "^0.6.5",
+    "babel-runtime-jsx-plus": "^0.1.3",
+    "chalk": "^2.4.2",
+    "rax-plugin-app": "^0.1.0-0",
+    "rax-ssr-dev-server": "^2.0.0-0",
+    "stylesheet-loader": "^0.6.5",
+    "universal-app-shell-loader": "^0.1.1"
+  }
+}
diff --git a/packages/rax-plugin-ssr/src/index.js b/packages/rax-plugin-ssr/src/index.js
@@ -0,0 +1,25 @@
+const SSRDevServer = require('rax-ssr-dev-server');
+
+const getSSRBuildConfig = require('./ssr/getBuildConfig');
+const getSSRDevConfig = require('./ssr/getDevConfig');
+const setWebBaseConfig = require('./web/setBaseConfig');
+
+// can‘t clone webpack chain object
+module.exports = ({ chainWebpack, registerConfig, setDevServer, context }) => {
+  chainWebpack((config, { command }) => {
+    const rootDir = context.rootDir;
+    setWebBaseConfig(config, rootDir);
+
+    let ssrConfig;
+    if (command === 'build') {
+      ssrConfig = getSSRBuildConfig(context);
+    }
+
+    if (command === 'dev') {
+      ssrConfig = getSSRDevConfig(context);
+      setDevServer(SSRDevServer);
+    }
+
+    registerConfig('ssr', ssrConfig);
+  });
+};
diff --git a/packages/rax-plugin-ssr/src/ssr/babel.config.js b/packages/rax-plugin-ssr/src/ssr/babel.config.js
@@ -0,0 +1,73 @@
+const chalk = require('chalk');
+
+const disableJSXPlus = process.env.DISABLE_JSX_PLUS;
+
+const config = {
+  presets: [
+    require.resolve('@babel/preset-flow'),
+    [
+      require.resolve('@babel/preset-env'),
+      {
+        targets: {
+          chrome: '49',
+          ios: '8'
+        },
+        loose: true,
+        modules: 'auto',
+        include: [
+          'transform-computed-properties'
+        ]
+      }
+    ],
+    [
+      require.resolve('@babel/preset-react'), {
+        'pragma': 'createElement',
+        'pragmaFrag': 'Fragment'
+      }
+    ]
+  ],
+  plugins: [
+    [
+      require.resolve('@babel/plugin-transform-runtime'),
+      {
+        'corejs': false,
+        'helpers': false,
+        'regenerator': true,
+        'useESModules': false
+      }
+    ],
+    require.resolve('@babel/plugin-syntax-dynamic-import'),
+    // Stage 0
+    require.resolve('@babel/plugin-proposal-function-bind'),
+    // Stage 1
+    require.resolve('@babel/plugin-proposal-export-default-from'),
+    [
+      require.resolve('@babel/plugin-proposal-optional-chaining'),
+      { loose: true },
+    ],
+    [
+      require.resolve('@babel/plugin-proposal-nullish-coalescing-operator'),
+      { loose: true },
+    ],
+    // Stage 2
+    [require.resolve('@babel/plugin-proposal-decorators'), { legacy: true }],
+    require.resolve('@babel/plugin-proposal-export-namespace-from'),
+    // Stage 3
+    [
+      require.resolve('@babel/plugin-proposal-class-properties'),
+      { loose: true },
+    ]
+  ]
+};
+
+if (!disableJSXPlus) {
+  // Enable jsx plus default.
+  config.plugins.push(require.resolve('babel-plugin-transform-jsx-list'));
+  config.plugins.push(require.resolve('babel-plugin-transform-jsx-condition'));
+  config.plugins.push(require.resolve('babel-plugin-transform-jsx-memo'));
+  config.plugins.push(require.resolve('babel-plugin-transform-jsx-slot'));
+  config.plugins.push([require.resolve('babel-plugin-transform-jsx-fragment'), { moduleName: 'rax' }]);
+  config.plugins.push(require.resolve('babel-plugin-transform-jsx-class'));
+}
+
+module.exports = config;