😺 准备dom结构

shalldie · May 10, 2018 · 39494f0 · 39494f0
1 parent d3be6a6
commit 39494f0
Show file tree

Hide file tree

Showing 19 changed files with 12,474 additions and 26 deletions.
diff --git a/LICENSE b/LICENSE
@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2018 谢爽
+Copyright (c) 2018 shalldie
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

diff --git a/build/webpack.config.base.js b/build/webpack.config.base.js
@@ -13,18 +13,24 @@ module.exports = {
         rules: [
             {
                 test: /\.css$/,
-                use: ['style-loader', 'css-loader']
+                use: ['style-loader', 'css-loader', 'postcss-loader']
             },
             {
                 test: /\.scss$/,
-                use: ['style-loader', 'css-loader', 'sass-loader']
+                use: ['style-loader', 'css-loader', 'postcss-loader', 'sass-loader']
             },
             {
                 test: /\.(png|jpg|gif)$/,
                 use: ['url-loader']
             },
             {
-                test: /\.js$/, exclude: /node_modules/, loader: "babel-loader"
+                test: /\.js$/,
+                exclude: /node_modules/,
+                use: ['babel-loader']
+            },
+            {
+                test: /\.html$/,
+                use: ['html-loader']
             }
         ]
     }

diff --git a/build/webpack.config.pro.js b/build/webpack.config.pro.js
@@ -2,6 +2,16 @@ const path = require('path');
 const webpackConfig = require('./webpack.config.base.js');
 const merge = require('webpack-merge');
 
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
+const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
+
+webpackConfig.module.rules.forEach(item => {
+    if (item.use[0] === 'style-loader') {
+        item.use[0] = MiniCssExtractPlugin.loader;
+    }
+});
+
 module.exports = merge(webpackConfig, {
     mode: 'production',
 
@@ -13,6 +23,26 @@ module.exports = merge(webpackConfig, {
         library: 'gitComment',
         libraryTarget: 'umd',
         libraryExport: 'default'
-    }
+    },
+
+    optimization: {
+        minimizer: [
+            new UglifyJsPlugin({
+                cache: true,
+                parallel: true,
+                sourceMap: false // set to true if you want JS source maps
+            }),
+            new OptimizeCSSAssetsPlugin({})
+        ]
+    },
+
+    plugins: [
+        new MiniCssExtractPlugin({
+            // Options similar to the same options in webpackOptions.output
+            // both options are optional
+            filename: "[name].css"
+            // chunkFilename: "[id].css"
+        })
+    ]
 
 });
diff --git a/dist/git-comment.css b/dist/git-comment.css
@@ -0,0 +1 @@
+body{background:#2ad;transition:.3s;animation:fdasf 3s linear}
diff --git a/dist/git-comment.js b/dist/git-comment.js
diff --git a/index.html b/index.html
@@ -6,6 +6,16 @@
 </head>
 <body>
     <div id="root"></div>
+    <style>
+    #root {
+        box-sizing: border-box;
+        margin: 50px auto;
+        width: 800px;
+        min-height: 200px;
+        background: #fff;
+        border: 1px solid #ddd
+    }
+    </style>
     <script src="/dist/index.js"></script>
 </body>
 </html>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		body{background:#2ad;transition:.3s;animation:fdasf 3s linear}