Nanka null patch 2

.babelrc

@@ -1,16 +1,16 @@
 {
   "presets": [
-    ["env", {
+    ["@babel/preset-env", {
       "modules": false
     }],
-    "react",
-    "stage-0"
+    "@babel/preset-react",
   ],
   "plugins": [
-    ["import",
-      { "libraryName": "antd", "style": true }
-    ],
-    "transform-runtime",
-    "transform-decorators-legacy"
+    ["import", { "libraryName": "antd", "style": true }, "antd"],
+    ["import", { "libraryName": "@alifd/next", "style": true }, "@alifd/next"],
+
+    ["@babel/plugin-transform-runtime",{"corejs": 2}],
+    ["@babel/plugin-proposal-decorators", { "legacy": true }],
+    ["@babel/plugin-proposal-class-properties", { "loose": true }]
   ]
 }

.github/workflows/main.yml

@@ -0,0 +1,60 @@
+# This is a basic workflow to help you get started with Actions
+
+name: CI
+
+# Controls when the action will run. Triggers the workflow on push or pull request
+# events but only for the master branch
+on:
+  push:
+    branches: [ typescript ]
+  pull_request:
+    branches: [ master ]
+
+# A workflow run is made up of one or more jobs that can run sequentially or in parallel
+jobs:
+  code_quality:
+    runs-on: ubuntu-lates
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 12
+          registry-url: https://registry.npmjs.org/
+      - name: lint
+        run: npm run lint
+        env:
+          CI: true
+
+  # 当 merge_requests 执行 tsc 类型检查
+  check_types:
+    runs-on: ubuntu-lates
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 12
+          registry-url: https://registry.npmjs.org/
+      - name: check-types
+        run: npm run check-types
+        env:
+          CI: true
+
+  # This workflow contains a single job called "build"
+  build:
+    # The type of runner that the job will run on
+    runs-on: ubuntu-latest
+
+    # Steps represent a sequence of tasks that will be executed as part of the job
+    steps:
+    # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
+    - uses: actions/checkout@v2
+
+    # Runs a single command using the runners shell
+    - name: Run a one-line script
+      run: echo Hello, world!
+
+    # Runs a set of commands using the runners shell
+    - name: Run a multi-line script
+      run: |
+        echo Add other actions to build,
+        echo test, and deploy your project.

.github/workflows/npm-publish.yml

@@ -0,0 +1,47 @@
+# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
+# For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages
+
+name: Node.js Package
+
+on:
+  release:
+    types: [created]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 12
+      - run: npm ci
+      - run: npm test
+
+  publish-npm:
+    needs: build
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 12
+          registry-url: https://registry.npmjs.org/
+      - run: npm ci
+      - run: npm publish
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.npm_token}}
+
+  publish-gpr:
+    needs: build
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 12
+          registry-url: https://npm.pkg.github.com/
+      - run: npm ci
+      - run: npm publish
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}

README.md

@@ -1,2 +1,64 @@
 # my-react
-尝试搭建脚手架
+react-webpack脚手架，参考pc-react-ant.design + 云日志 + 各种文档
+
+==========================
+
+### typescript-react
+```text
+ typescript 的 在分支typescript下
+```
+
+==========================
+
+#### 新增fusion design 
+1. 安装依赖
+```
+yarn add @alifd/next 
+
+// 主题包
+yarn add @alifd/theme-4
+yarn add @alifd/next-theme-loader @alifd/next-theme-webpack-plugin
+
+```
+2. 按需引入配置
+(1) babel配置修改
+```
+"plugins": [
+  ["import",[
+    { "libraryName": "antd", "style": true },
+    { "libraryName": "@alifd/next", "style": true }
+  ]],
+  ...
+]
+```
+(2) webpack 配置
+```
+module: {
+ rules: [
+   {
+     test: /\.scss$/,
+     use: [
+       ...
+       '@alifd/next-theme-loader?{"theme":"@alifd/theme-4"}' // 主题包
+     ]
+   },
+   ...
+ ]
+},
+plugins: [
+  new ThemePlugin({ theme: '@alifd/theme-4' }), // 主题包
+  ...
+]
+
+```
+3. 注意点
+```
+官方文档在主题包css文件按需引入的webpack配置中用了extract-text-webpack-plugin
+但这个插件默认安装的版本是不支持webpack4.x的，但他又一个4.0的beta版本支持webpack4.x
+因此 yarn add extract-text-webpack-plugin@next -D
+
+```
+<!-- test key -->
+
+
+

build/dev.js

@@ -1,15 +1,16 @@
 const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
-// const CopyWebpackPlugin = require('copy-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 const path = require('path');
 const buildPath = path.resolve(__dirname, '../dist');
+const ThemePlugin = require('@alifd/next-theme-webpack-plugin');
 // const  theme = require('../antd-theme.js');
 module.exports = {
   mode:'development',
   devtool: 'cheap-module-eval-source-map',
   context:path.resolve(__dirname, '../src'), // 解析起点
   entry:{
-    vendor: ['react'],
+    vendor: ['react', 'react-dom', 'react-router', 'moment'],
     app: ['./main.js']
   },
   output: {
@@ -36,7 +37,7 @@ module.exports = {
         test: /\.js|jsx$/,
         exclude: /node_modules/, // exclude不包括，include只命中
         use:['babel-loader?cacheDirectory'],
-        // use: { // 这算是第二种写法，和上面的意义是一样的
+         // use: { // 这算是第二种写法，和上面的意义是一样的
         //   loader: 'babel-loader',
         //   options: {
         //     cacheDirectory:true
@@ -46,18 +47,19 @@ module.exports = {
       {
         test: /\.(less|css)$/,
         use: [
-          'style-loader',
-          'css-loader',
-          'less-loader'
-          // 'less-loader?{modifyVars:'+JSON.stringify(theme)+'}'
-        ],
+            'style-loader',
+            'css-loader',
+            'less-loader'
+            // 'less-loader?{modifyVars:'+JSON.stringify(theme)+'}'
+          ],
       },
       {
         test: /\.(scss|sass)$/,
         use: [
           'style-loader', //上面的简写方式
           'css-loader',
-          'sass-loader'
+          'sass-loader',
+          '@alifd/next-theme-loader?{"theme":"@alifd/theme-4"}'
         ]
       },
       {
@@ -70,33 +72,39 @@ module.exports = {
     new HtmlWebpackPlugin({
       filename: 'index.html',
       template: 'index.html',
+      hash: false,
+      chunksSortMode:'none',
+      title:'webpack-react',
+      assets: {
+        favicon: '/images/favicon.ico', 
+        config_js: '/config/conf.dev.js'
+      }
     }),
     new webpack.NamedModulesPlugin(),
-    // new webpack.HotModuleReplacementPlugin(),
-    // new CopyWebpackPlugin([ 
-      // {from: path.resolve(__dirname,'../public/config'),to:'config'},
-      // {from: path.resolve(__dirname,'../public/mock'),to:'mock'},
-      // {from: path.resolve(__dirname,'../public/images'),to:'images'},
-      // {from: path.resolve(__dirname,'../public/fonts'),to:'fonts'},
-      // {from: path.resolve(__dirname,'../public/pages'),to:'pages'}
-    // ])
+    new webpack.HotModuleReplacementPlugin(),
+    new webpack.DefinePlugin({__PRODUCTION: JSON.stringify(false)}),
+    new CopyWebpackPlugin([ 
+      {from: path.resolve(__dirname,'../public/images'),to:'images'},
+      {from: path.resolve(__dirname,'../public/config'),to:'config'},
+      {from: path.resolve(__dirname,'../public/fonts'),to:'fonts'},
+    ]),
+    new ThemePlugin({ theme: '@alifd/theme-4' }),
   ],
   devServer: {
     host: '0.0.0.0',
     port: '8181',
     contentBase: buildPath,
     publicPath: '/',
     historyApiFallback: true,
-    // disableHostCheck: true,
-    // compress: true,
-    // hot: true, // 开启模块热替换功能
-    // inline:true, // 自动刷新网页实现实时预览
-    // proxy: [{
-    //   path: '/api',
-    //   // target: 'http://172.16.0.98:8788',//本地
-    //   target: 'http://47.101.183.209:8788',//测试
-    //   changeOrigin: true
-    // }]
+    disableHostCheck: true,
+    compress: true,
+    hot: true, // 开启模块热替换功能
+    inline:true, // 自动刷新网页实现实时预览
+    proxy: [{
+      path: '/users',
+      target: 'https://api.github.com',//测试
+      changeOrigin: true
+    }]
   }
 };
 

build/prod.js

@@ -1,5 +1,6 @@
 const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 const path = require('path');
 const buildPath = path.resolve(__dirname, '../dist');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
@@ -9,8 +10,8 @@ module.exports = {
   mode:'production',
   context:path.resolve(__dirname, '../src'), // 解析起点
   entry:{
-    vendor: ['react'],
-    app: ['./main.js']
+    vendor: ['react', 'react-dom', 'react-router', 'moment'],
+    app: ['babel-polyfill','./main.js']
   },
   output: {
     path: buildPath, // 输出文件存放在本地的目录
@@ -102,20 +103,27 @@ module.exports = {
     new HtmlWebpackPlugin({
       filename: 'index.html',
       template: 'index.html',
+      hash: false,
+      chunksSortMode:'none',
+      title:'webpack-react',
+      assets: {
+        favicon: '/images/favicon.ico', 
+        config_js: '/config/conf.prod.js'
+      }
     }),
-    new webpack.NamedModulesPlugin(),
     new webpack.optimize.OccurrenceOrderPlugin(true),
     new MiniCssExtractPlugin({
       filename: 'css/[name].[hash].css',
       chunkFilename: 'css/[name].[hash].css'
     }),
-    // new CopyWebpackPlugin([
-    //   {from: path.resolve(__dirname,'../public/config'),to:'config'},
-    //   {from: path.resolve(__dirname,'../public/mock'),to:'mock'},
-    //   {from: path.resolve(__dirname,'../public/images'),to:'images'},
-    //   {from: path.resolve(__dirname,'../public/fonts'),to:'fonts'},
-    //   {from: path.resolve(__dirname,'../public/pages'),to:'pages'}
-    // ]),
+    new CopyWebpackPlugin([ 
+      {from: path.resolve(__dirname,'../public/images'),to:'images'},
+      {from: path.resolve(__dirname,'../public/config'),to:'config'},
+      // {from: path.resolve(__dirname,'../public/mock'),to:'mock'},
+      // {from: path.resolve(__dirname,'../public/images'),to:'images'},
+      {from: path.resolve(__dirname,'../public/fonts'),to:'fonts'},
+      // {from: path.resolve(__dirname,'../public/pages'),to:'pages'}
+    ]),
     new webpack.DefinePlugin({
       __PRODUCTION: JSON.stringify(true)
     }),