refactor build system

sstur · Mar 15, 2016 · 36cbbbb · 36cbbbb
1 parent 2cc1add
commit 36cbbbb
Show file tree

Hide file tree

Showing 9 changed files with 44 additions and 29 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,4 +1,5 @@
 _*
 !__tests__
+/dist
 /lib
 /node_modules
diff --git a/assets/dist/.gitignore b/assets/dist/.gitignore
diff --git a/demo.html b/demo.html
@@ -4,7 +4,7 @@
     <title>React Rich Text Editor Example</title>
     <link rel="icon" type="image/x-icon" href="/assets/react.ico" />
     <link rel="stylesheet" href="/assets/css/demo.css" />
-    <script src="/assets/dist/demo.js"></script>
+    <script src="/dist/demo.js"></script>
   </head>
   <body></body>
 </html>
diff --git a/package.json b/package.json
@@ -2,13 +2,14 @@
   "name": "react-rte",
   "version": "0.1.10",
   "description": "React Rich Text Editor",
-  "main": "lib/RichTextEditor.js",
+  "main": "dist/react-rte.js",
   "scripts": {
-    "build-demo": "webpack",
+    "build": "npm run build-lib && npm run build-dist",
+    "build-dist": "rimraf dist && webpack",
     "build-lib": "rimraf lib && babel src --ignore '_*' --out-dir lib",
     "lint": "eslint --max-warnings 0 .",
     "typecheck": "flow",
-    "prepublish": "npm run build-lib",
+    "prepublish": "npm run build",
     "test": "npm run lint && npm run typecheck && npm run test-src",
     "test-src": "mocha"
   },
@@ -37,6 +38,7 @@
     "babel-preset-stage-2": "^6.5.0",
     "class-autobind": "^0.1.0",
     "css-loader": "^0.23.1",
+    "css-modules-require-hook": "^4.0.0",
     "eslint": "2.2.0",
     "eslint-plugin-babel": "^3.1.0",
     "eslint-plugin-flow-vars": "^0.2.1",

diff --git a/src/EditorDemo.js b/src/EditorDemo.js
@@ -1,10 +1,11 @@
 /* @flow */
 import React, {Component} from 'react';
 import RichTextEditor from './RichTextEditor';
-import type {EditorValue} from './RichTextEditor';
 import {convertToRaw} from 'draft-js';
 import autobind from 'class-autobind';
 
+import type {EditorValue} from './RichTextEditor';
+
 type Props = {};
 type State = {
   value: EditorValue;

diff --git a/src/__tests__/RichTextEditor-test.js b/src/__tests__/RichTextEditor-test.js
@@ -12,6 +12,7 @@ describe('RichTextEditor', () => {
     renderer.render(<RichTextEditor value={value} />);
     let output = renderer.getRenderOutput();
     expect(output.type).toEqual('div');
-    expect(output.props.className).toEqual('rte-root');
+    expect(output.props.className).toBeA('string');
+    expect(output.props.className).toInclude('RichTextEditor__root');
   });
 });
diff --git a/test/init.js b/test/init.js
@@ -0,0 +1,3 @@
+require('css-modules-require-hook')({
+  generateScopedName: '[name]__[local]___[hash:base64:5]',
+});
diff --git a/test/mocha.opts b/test/mocha.opts
@@ -1,2 +1,3 @@
 --compilers js:babel-core/register
+--require ./test/init.js
 src/__tests__/*.js src/**/__tests__/*.js
diff --git a/webpack.config.js b/webpack.config.js
@@ -1,27 +1,36 @@
 /*eslint-env node */
 var path = require('path');
 
-module.exports = {
-  entry: {
-    demo: './src/demo.js',
+var loaders = [
+  {test: /\.js$/, loader: 'babel'},
+  {
+    test: /\.css$/,
+    exclude: /\.global\.css$/,
+    loaders: [
+      'style?sourceMap',
+      'css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]',
+    ],
   },
+  {test: /\.global\.css$/, loader: 'style!raw'},
+];
+
+module.exports = [{
+  entry: './src/RichTextEditor.js',
   output: {
-    path: path.join(__dirname, 'assets/dist'),
-    publicPath: '/assets/dist/',
-    filename: '[name].js',
+    path: path.join(__dirname, 'dist'),
+    filename: 'react-rte.js',
+    libraryTarget: 'commonjs2',
   },
-  module: {
-    loaders: [
-      {test: /\.js$/, loader: 'babel'},
-      {
-        test: /\.css$/,
-        exclude: /\.global\.css$/,
-        loaders: [
-          'style?sourceMap',
-          'css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]',
-        ],
-      },
-      {test: /\.global\.css$/, loader: 'style!raw'},
-    ],
+  externals: {
+    react: 'react',
+    'react-dom': 'react-dom',
+  },
+  module: {loaders: loaders},
+}, {
+  entry: './src/demo.js',
+  output: {
+    path: path.join(__dirname, 'dist'),
+    filename: 'demo.js',
   },
-};
+  module: {loaders: loaders},
+}];