Renaming component css to styles.css to be a bit more generic. Removing unused webpack config file. Removving unused config property. Updating npmignore and README

jfusco · jfusco · commit be0d26e414e3 · 2016-11-06T12:36:12.000-05:00
diff --git a/.babelrc b/.babelrc
@@ -5,6 +5,7 @@
 	],
 	"plugins": [
 		"transform-function-bind",
-		"transform-class-properties"
+		"transform-class-properties",
+		"transform-object-rest-spread"
 	]
 }
diff --git a/.npmignore b/.npmignore
@@ -18,5 +18,5 @@ demo.gif
 .travis.yml
 config.json
 gulpfile.babel.js
-webpack.config.build.babel.js
+webpack.config.babel.js
 webpack.config.example.babel.js
diff --git a/README.md b/README.md
@@ -206,7 +206,7 @@ $tag-input-placeholder-color
 
 If you don't care to override variables and just want to override actual styles you may choose to import the minified compiled version of the css instead
 ```scss
-@import "node_modules/react-tagging-input/dist/react-tags.css";
+@import "node_modules/react-tagging-input/dist/styles.css";
 ```
 
 ## Tests ##
diff --git a/config.json b/config.json
@@ -1,7 +1,4 @@
 {
-	"css": {
-		"fileName": "react-tags"
-	},
 	"scripts": {
 		"fileName": "react-tags",
 		"entry": "Tags",
diff --git a/dist/react-tags.css.map b/dist/react-tags.css.map
diff --git a/dist/styles.css b/dist/styles.css
diff --git a/dist/styles.css.map b/dist/styles.css.map
diff --git a/docs/coverage/clover.xml b/docs/coverage/clover.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<coverage generated="1478449184077" clover="3.2.0">
-  <project timestamp="1478449184077" name="All files">
+<coverage generated="1478453527219" clover="3.2.0">
+  <project timestamp="1478453527219" name="All files">
     <metrics statements="52" coveredstatements="52" conditionals="71" coveredconditionals="52" methods="22" coveredmethods="22" elements="145" coveredelements="126" complexity="0" loc="52" ncloc="52" packages="1" files="2" classes="2">
       <file name="Tag.js" path="/Users/Rinzler/Projects/Personal/react-tagging-input/src/component/js/Tag.js">
         <metrics statements="8" coveredstatements="8" conditionals="7" coveredconditionals="6" methods="3" coveredmethods="3"/>
diff --git a/docs/coverage/lcov-report/Tag.js.html b/docs/coverage/lcov-report/Tag.js.html
@@ -160,7 +160,7 @@ <h1>
 </div><!-- /wrapper -->
 <div class='footer quiet pad2 space-top1 center small'>
   Code coverage
-  generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sun Nov 06 2016 11:19:43 GMT-0500 (EST)
+  generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sun Nov 06 2016 12:32:07 GMT-0500 (EST)
 </div>
 </div>
 <script src="prettify.js"></script>
diff --git a/docs/coverage/lcov-report/Tags.js.html b/docs/coverage/lcov-report/Tags.js.html
@@ -574,7 +574,7 @@ <h1>
 </div><!-- /wrapper -->
 <div class='footer quiet pad2 space-top1 center small'>
   Code coverage
-  generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sun Nov 06 2016 11:19:43 GMT-0500 (EST)
+  generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sun Nov 06 2016 12:32:07 GMT-0500 (EST)
 </div>
 </div>
 <script src="prettify.js"></script>
diff --git a/docs/coverage/lcov-report/index.html b/docs/coverage/lcov-report/index.html
@@ -90,7 +90,7 @@ <h1>
 </div><!-- /wrapper -->
 <div class='footer quiet pad2 space-top1 center small'>
   Code coverage
-  generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sun Nov 06 2016 11:19:43 GMT-0500 (EST)
+  generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sun Nov 06 2016 12:32:07 GMT-0500 (EST)
 </div>
 </div>
 <script src="prettify.js"></script>
diff --git a/docs/index.html b/docs/index.html
@@ -8,7 +8,7 @@
 	<title>React Tags Component</title>
 
 	<link rel=stylesheet href="index.css">
-	<link rel=stylesheet href="react-tags.css">
+	<link rel=stylesheet href="styles.css">
 </head>
 <body>
 	<div id="application"></div>
diff --git a/docs/styles.css b/docs/styles.css
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "react-tagging-input",
-	"version": "1.6.3",
+	"version": "1.6.4",
 	"description": "Simple tagging component",
 	"main": "dist/react-tags.js",
 	"license": "MIT",
@@ -23,6 +23,7 @@
 		"babel-loader": "^6.2.7",
 		"babel-plugin-transform-class-properties": "^6.18.0",
 		"babel-plugin-transform-function-bind": "^6.8.0",
+		"babel-plugin-transform-object-rest-spread": "^6.16.0",
 		"babel-preset-es2015": "^6.18.0",
 		"babel-preset-react": "^6.16.0",
 		"babel-register": "^6.18.0",
@@ -56,10 +57,10 @@
 	"scripts": {
 		"test": "jest --coverage",
 		"lint": "eslint --fix --color --debug --ignore-path .eslintignore ./src/component/js/*",
-		"start": "cross-env NODE_ENV=dev webpack-dev-server --config ./webpack.config.build.babel.js --hot --inline",
+		"start": "cross-env NODE_ENV=dev webpack-dev-server --config ./webpack.config.babel.js --hot --inline",
 		"start-docs": "webpack-dev-server --config ./webpack.config.example.babel.js --hot --inline",
 		"build-docs": "webpack --config ./webpack.config.example.babel.js",
-		"build": "gulp && npm run lint && npm test && cross-env NODE_ENV=prod webpack --config ./webpack.config.build.babel.js --display-chunks --display-modules --progress --colors && npm run build-docs"
+		"build": "gulp && npm run lint && npm test && cross-env NODE_ENV=prod webpack --config ./webpack.config.babel.js --display-chunks --display-modules --progress --colors && npm run build-docs"
 	},
 	"jest": {
 		"scriptPreprocessor": "<rootDir>/node_modules/webpack-babel-jest",
diff --git a/src/component/index.html b/src/component/index.html
@@ -5,7 +5,7 @@
 	<title>Component Development</title>
 
 	<style>
-		.react-tags__container {
+		#application {
 			margin: 50px;
 		}
 	</style>
diff --git a/src/example/index.html b/src/example/index.html
@@ -8,7 +8,7 @@
 	<title>React Tags Component</title>
 
 	<link rel=stylesheet href="index.css">
-	<link rel=stylesheet href="react-tags.css">
+	<link rel=stylesheet href="styles.css">
 </head>
 <body>
 	<div id="application"></div>
diff --git a/webpack.config.babel.js b/webpack.config.babel.js
@@ -1,63 +1,40 @@
 'use strict';
 
-import webpack from 'webpack';
 import path from 'path';
-import config from './config.json';
+import plugins from './webpack/plugins';
+import loaders from './webpack/loaders';
+import entry from './webpack/entry';
+import output from './webpack/output';
 
-const { library, entry, fileName } = config.scripts;
+const { NODE_ENV } = process.env;
 
-module.exports =  {
-	entry: {
-		[fileName]: `./src/js/${entry}.js`,
-		[`${fileName}.min`]: `./src/js/${entry}.js`
-	},
-	output: {
-		filename: '[name].js',
-		path: path.join(__dirname, '/dist'),
-		publicPath: '/',
-		libraryTarget: 'umd',
-		library
-	},
+const config = {
+	devtool: NODE_ENV === 'prod' ? 'source-map' : 'eval',
+	entry,
+	output,
 	module: {
-		loaders: [
-			{
-				loader: 'babel',
-				exclude: '/node_modules/',
-				test: /\.js?$/
-			}
-		]
+		loaders
 	},
-	externals: {
+	plugins,
+	resolve: {
+		extensions: ['', '.js']
+	}
+};
+
+if(NODE_ENV === 'prod'){
+	config.externals = {
 		'react': {
 			root: 'React',
 			commonjs2: 'react',
 			commonjs: 'react',
 			amd: 'react'
 		}
-	},
-	plugins: [
-		new webpack.NoErrorsPlugin(),
-		new webpack.optimize.DedupePlugin(),
-		new webpack.DefinePlugin({
-			'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
-		}),
-		new webpack.optimize.UglifyJsPlugin({
-			include: /\.min\.js$/,
-			comments: false,
-			beautify: false,
-			mangle: {
-				screw_ie8 : true
-			},
-			compress: {
-				warnings: false,
-				drop_console: true
-			},
-			output: {
-				comments: false
-			}
-		})
-	],
-	resolve: {
-		extensions: ['', '.js']
-	}
-};
+	};
+}else{
+	config.devServer = {
+		contentBase: path.join(__dirname, 'src/component'),
+		port: 8080
+	};
+}
+
+module.exports = config;
diff --git a/webpack.config.build.babel.js b/webpack.config.build.babel.js
diff --git a/webpack.config.example.babel.js b/webpack.config.example.babel.js
@@ -7,7 +7,6 @@ import ExtractTextPlugin from 'extract-text-webpack-plugin';
 import CopyWebpackPlugin from 'copy-webpack-plugin';
 
 const { library } = config.scripts;
-const { fileName } = config.css;
 
 module.exports =  {
 	entry: './src/example/index.js',
@@ -37,7 +36,7 @@ module.exports =  {
 	plugins: [
 		new webpack.NoErrorsPlugin(),
 		new webpack.optimize.DedupePlugin(),
-		new ExtractTextPlugin(`${fileName}.css`),
+		new ExtractTextPlugin('styles.css'),
 		new CopyWebpackPlugin([
 			{ from: './src/example/index.html', to: './' },
 			{ from: './src/example/index.css', to: './' },
diff --git a/webpack/plugins.js b/webpack/plugins.js

Original file line number	Diff line number	Diff line change
`@@ -5,6 +5,7 @@`
`5`	`5`	`],`
`6`	`6`	`"plugins": [`
`7`	`7`	`"transform-function-bind",`
`8`		`- "transform-class-properties"`
	`8`	`+ "transform-class-properties",`
	`9`	`+ "transform-object-rest-spread"`
`9`	`10`	`]`
`10`	`11`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,4 @@`
`1`	`1`	`{`
`2`		`- "css": {`
`3`		`- "fileName": "react-tags"`
`4`		`- },`
`5`	`2`	`"scripts": {`
`6`	`3`	`"fileName": "react-tags",`
`7`	`4`	`"entry": "Tags",`