集成redux

Author: devoutDisciple

.eslintignore

@@ -0,0 +1,4 @@
+dist
+node_modules
+assert
+public

.gitignore

@@ -1,4 +1,4 @@
 node_modules
 dist
 .vs_code
-.DS_Store
+.DS_Store

babel.config.js

@@ -12,6 +12,7 @@ const presets = [
 	'@babel/react'
 ];
 const plugins = [
+	['import', { libraryName: 'antd-mobile', style: 'css' }], // `style: true` 会加载 less 文件
 	'@babel/plugin-transform-arrow-functions',
 	'@babel/plugin-transform-block-scoped-functions',
 	'@babel/plugin-transform-async-to-generator',

build/webpack.config.base.js

@@ -12,13 +12,10 @@ const COMMON_0_CSS = new ExtractTextPlugin('common.0.css', {allChunks: true});
 const COMMON_1_CSS = new ExtractTextPlugin('common.1.css', {allChunks: true});
 const COMMON_0_LESS = new ExtractTextPlugin('app.0.css', {allChunks: true});
 const COMMON_1_LESS = new ExtractTextPlugin('app.1.css', {allChunks: true});
-
 const happyThreadPoolLength = os.cpus().length;
-
 const getRealPath = (temPath) => {
 	return path.resolve(__dirname, temPath);
 };
-
 const node_modules = getRealPath('../node_modules');
 
 module.exports = (env = 'development') => {
@@ -148,6 +145,10 @@ module.exports = (env = 'development') => {
 			// 	$config: getRealPath('../config/config'),
 			// }
 		},
+		externals: {
+			'react': 'React',
+			'react-dom': 'ReactDOM'
+		},
 		plugins: [
 			COMMON_0_CSS,
 			COMMON_1_CSS,

build/webpack.config.dev.js

@@ -4,8 +4,11 @@ const chalk = require('chalk');
 const config = require('../config/webpackConfig');
 const webpackBaseConfig = require('./webpack.config.base');
 const _ = require('lodash');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 const generateDll = require('../utils/generateDll');
-
+const getRealPath = (temPath) => {
+	return path.resolve(__dirname, temPath);
+};
 generateDll();
 
 let baseConfig = webpackBaseConfig('development');
@@ -30,6 +33,10 @@ let devPlugins = [
 		// name: '[name]_library',
 		manifest: require('../dist/manifest.json'),
 	}),
+	new CopyWebpackPlugin([
+		{ from: getRealPath('../node_modules/react/umd/react.production.min.js'), to: getRealPath('../dist/react.production.min.js') },
+		{ from: getRealPath('../node_modules/react-dom/umd/react-dom.production.min.js'), to: getRealPath('../dist/react-dom.production.min.js') },
+	]),
 	/*eslint-disable*/
 	new webpack.DefinePlugin({
 		"process.env.NODE_ENV": JSON.stringify("development"),// 一定要用json.stringify，如果是单引号的'development',不正确，是定义不了process.env.NODE_ENV的

build/webpack.config.prod.js

@@ -6,13 +6,17 @@ const merge = require('webpack-merge');
 const webpackBaseConfig = require('./webpack.config.base');
 const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
 const CleanWebpackPlugin = require('clean-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 // var CompressionWebpackPlugin = require('compression-webpack-plugin');// 开启gzip压缩
 // const config = require('../config/webpackConfig');
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 //获取npm后面的命令
 const commandTarget = process.env.npm_lifecycle_event; // npm run start:build 获取的是start:build
 let startAnalyzer = _.includes(_.toLower(commandTarget), 'analyzer');
 console.log(chalk.yellow(`logging: the project is openning analyzer, the startAnalyzer is ${startAnalyzer}`));
+const getRealPath = (temPath) => {
+	return path.resolve(__dirname, temPath);
+};
 
 let plugins = [
 	new CleanWebpackPlugin(path.resolve(__dirname, '../dist'), {
@@ -45,7 +49,11 @@ let plugins = [
 	new webpack.optimize.LimitChunkCountPlugin({
 		maxChunks: 5, // Must be greater than or equal to one
 		minChunkSize: 1000
-	}),
+    }),
+    new CopyWebpackPlugin([
+		{ from: getRealPath('../node_modules/react/umd/react.production.min.js'), to: getRealPath('../dist/react.production.min.js') },
+		{ from: getRealPath('../node_modules/react-dom/umd/react-dom.production.min.js'), to: getRealPath('../dist/react-dom.production.min.js') },
+	]),
 	// new CompressionWebpackPlugin(),
 	// 打包moment.js的中文，防止local全部打包
 	new webpack.ContextReplacementPlugin(/moment[/\\]locale$/,/zh-cn/),

index.html

@@ -1,12 +1,39 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
-	<title>Document</title>
+    <meta name="keywords" content="网易云音乐,web app">
+    <meta itemprop="name" content="网易云音乐">
+    <meta itemprop="author" content="zhangzhen">
+    <meta property="og:title" content="网易云音乐">
+    <title>网易云-webApp</title>
+    <meta property="og:type" content="website">
+    <meta property="og:image" content="http://p3.music.126.net/tBTNafgjNnTL1KlZMt7lVA==/18885211718935735.jpg">
+    <meta property="og:url" content="https://music.163.com/m">
+    <link rel="shortcut icon" href="http://p3.music.126.net/0ZrFKozxhB6nPQYZl4lsEA==/109951163421145421.png" type="image/x-icon">
+    <script src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></script>
+    <script>
+        if ('addEventListener' in document) {
+            document.addEventListener('DOMContentLoaded', function () {
+                FastClick.attach(document.body);
+            }, false);
+        }
+        if (!window.Promise) {
+            document.writeln(
+                '<script src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"' + '>' +
+                '<' + '/' + 'script>');
+        }
+
+    </script>
 </head>
+
 <body>
     <div id="root"></div>
+    <script src="./react.production.min.js"></script>
+    <script src="./react-dom.production.min.js"></script>
 </body>
+
 </html>