Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat: Rax PWA #1097

Merged
merged 132 commits into from
Jul 8, 2019
Merged

Feat: Rax PWA #1097

merged 132 commits into from
Jul 8, 2019

Conversation

fyangstudio
Copy link
Collaborator

通过项目 app.json 的配置新增或修改项目代码,更新构建配置增强 Web 体验。

  • 支持 App Shell 编译并插入 HTML 中 (支持 Hot Reload)
  • 支持骨骼图编译并插入 HTML 中(支持 Hot Reload)
  • 支持使用 document.js 代替 index.html(支持 Hot Reload)
  • 支持快速生成构建 SPA 应用(支持 Hot Reload)
  • 支持页面 alive 增强页面切换体验。

Add or modify the project code through the configuration of project app.json, update the build configuration to enhance the Web experience.

  • App Shell is supported to compile and insert into HTML (Hot Reload is supported)
  • Support for bone map compilation and insertion into HTML (Hot Reload is supported)
  • Supports using document.js instead of index.html (Hot Reload is supported)
  • Support for rapid generation of building SPA applications (Hot Reload support)
  • Support page alive to enhance the page switching experience.

@@ -1,6 +1,6 @@
{
"name": "rax-cli",
"version": "1.4.0",
"version": "1.4.1-0",
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这里正是上线前要改下版本

*
*/

const RaxPWAPlugins = require('./config/RaxPWAPlugins');
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

按照上周的结论,应该是细粒度的引用,就没有这个文件了?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

我认为还是需要的,PWA 作为一系列的解决方案,理应需要一种更简单的接入。

const path = require('path');
const pathToRegexp = require('path-to-regexp');

const getSPAPagesConfig = (appConfig, pathConfig) => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

pages 有没有可能是外部传入的,这样就和工程结构解耦了

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

搭建类页面解决方案 2期迭代

import { createElement, useState } from 'rax';
import Error from './Error';
import isPathMatched from './isPathMatched';
import { createHashHistory, createBrowserHistory } from 'history';
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

引入这个库 对包大小的影响大吗

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

单页应用 router 必须依赖 history,不是可选的

Copy link
Collaborator

@wssgcg1213 wssgcg1213 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK

@@ -6,6 +6,7 @@

.DS_Store
.idea/
.temp/
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mark

import hydrate from 'rax-hydrate';
import {render} from 'rax';
import * as DriverDOM from 'driver-dom';
${withAppShell === 'true' ? "import AppShell from '../../shell/';" : ''}
window.onload = function(){
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

addEventListener

${functionName}.getInitialProps().then(function(props) {
hydrate(createElement(${functionName}, props || {}), document.getElementById('root'));
${functionName}.getInitialProps().then(function(data) {
${renderCodeStr}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

renderCodeStr

rax: 'rax',
},
resolve: {
extensions: ['.js', '.jsx', 'mjs'],
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

. mjs

},
module: {
rules: [{
test: /\.jsx?$/,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

考虑 case insensitive

});

try {
fs.mkdirSync(pathConfig.appDirectory + '/.temp');
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

先判断 exists

compilation.assets['index.html'] = {
source: () => htmlCode,
size: () => htmlCode.length
};
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

import { RawSource } from 'webpack-sources';
compilation.assets['index.html'] = new RawSource(value);

http://unpkg.alibaba-inc.com/webpack-sources/lib/RawSource.js


const interopRequire = (obj) => {
return obj && obj.__esModule ? obj.default : obj;
};
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

function

const isProductionLikeMode = isProductionMode(compiler);

try {
fs.mkdirSync(pathConfig.appDirectory + '/.temp');
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这里应该需要加下判断 如果已经存在就不需要重复创建

@fyangstudio
Copy link
Collaborator Author

准备发布

@fyangstudio fyangstudio merged commit 630475a into master Jul 8, 2019
@delete-merged-branch delete-merged-branch bot deleted the feat-pwa branch July 8, 2019 02:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants