📦 Switch to Yarn workspaces; overhaul build system

.vscode/settings.json

@@ -2,7 +2,6 @@
     "typescript.tsdk": "./node_modules/typescript/lib",
     "files.exclude": {
         "**/build": true,
-        "**/dist": true,
         "**/coverage": true,
         "docs": true
     },

.yarnrc

@@ -0,0 +1 @@
+workspace-experimental true

Gulpfile.js

@@ -97,21 +97,6 @@ const projects = [
         webpack: {
             entry: "src/index.tsx",
             dest: "dist",
-            localResolve: [
-                // locally resolve @blueprintjs packages so example components will compile
-                // (they all import @blueprint/* but don't actually have themselves in their node_modules)
-                "@blueprintjs/core",
-                "@blueprintjs/datetime",
-                "@blueprintjs/docs",
-                "@blueprintjs/labs",
-                "@blueprintjs/table",
-                "dom4",
-                "moment",
-                "normalize.css",
-                "react",
-                "react-addons-css-transition-group",
-                "react-dom",
-            ],
         },
         copy: {
             "resources/favicon.png": { to: ["resources/"], base: "resources/" },

README.md

@@ -34,7 +34,7 @@ The other packages (`site-docs` and `site-landing`) are not published to NPM as
 We use [Lerna](https://lernajs.io/) to manage inter-package dependencies in this monorepo.
 Builds are orchestrated via [Gulp](http://gulpjs.com/) tasks.
 
-__Prerequisites__: Node.js v6+, Yarn v0.28+
+__Prerequisites__: Node.js v8+, Yarn v1.0+
 
 1. `git clone` this repository (or fork if you lack permissions).
 1. `yarn` to install dependencies at the root of the repo.

circle.yml

@@ -21,29 +21,22 @@ machine:
   pre:
     - mkdir ~/yarn
   environment:
-    YARN_VERSION: 0.28.4
+    YARN_VERSION: 1.2.1
     PATH: $PATH:$HOME/$CIRCLE_PROJECT_REPONAME/node_modules/.bin
   node:
-    version: 7.10.0
+    version: 8.5.0
 
 dependencies:
   cache_directories:
     - ~/yarn
     - ~/.cache/yarn
-    - ~/$CIRCLE_PROJECT_REPONAME/packages/core/node_modules
-    - ~/$CIRCLE_PROJECT_REPONAME/packages/datetime/node_modules
-    - ~/$CIRCLE_PROJECT_REPONAME/packages/docs/node_modules
-    - ~/$CIRCLE_PROJECT_REPONAME/packages/labs/node_modules
-    - ~/$CIRCLE_PROJECT_REPONAME/packages/site-docs/node_modules
-    - ~/$CIRCLE_PROJECT_REPONAME/packages/site-landing/node_modules
-    - ~/$CIRCLE_PROJECT_REPONAME/packages/table/node_modules
   # non-zero exit codes in `dependencies` group will fail the build early
   # so these following commands will block the build and prevent tests
   override:
     - curl -o- -L https://yarnpkg.com/install.sh | bash -s -- --version $YARN_VERSION
-    - yarn install --pure-lockfile
-    - echo "Checking if yarn.lock changed..." && git diff --exit-code
+    - yarn
     - yarn bootstrap
+    - echo "Checking if lockfiles changed..." && git diff --exit-code
     - yarn build:gulp
 
 test:

gulp/util/karma-config.js

@@ -3,34 +3,42 @@
  */
 "use strict";
 
+const path = require("path");
+
 const COVERAGE_PERCENT = 80;
 const COVERAGE_PERCENT_HIGH = 90;
 
 module.exports = function createConfig(project) {
     const webpackConfigGenerator = require("./webpack-config");
     const webpackConfig = webpackConfigGenerator.generateWebpackKarmaConfig(project);
-    // must delete this key in order to resolve root @types packages correctly.
-    delete webpackConfig.ts.compilerOptions.typeRoots;
 
-    const resourcesGlob = (project.id === "core" ? "." : "node_modules/@blueprintjs/*");
     const filesToInclude = [
         {
-            included: false,
-            pattern: "node_modules/**/*.css",
-            served: true,
+            included: true,
+            pattern: path.resolve("node_modules/normalize.css/normalize.css"),
+            watched: false,
         },
+        // (core files are inserted here below)
         {
             included: false,
-            pattern: resourcesGlob + "/resources/**/*",
-            served: true,
+            pattern: "resources/**/*",
+            watched: false,
         },
         "dist/**/*.css",
         "test/index.ts",
     ];
 
-    // include core's CSS in all projects
+    // in all other projects, include core CSS and expose resources
     if (project.id !== "core") {
-        filesToInclude.push("node_modules/@blueprintjs/core/**/*.css");
+        filesToInclude.splice(1, 0, {
+            included: true,
+            pattern: path.resolve("packages/core/dist/*.css"),
+            watched: false,
+        }, {
+            included: false,
+            pattern: path.resolve("packages/core/resources/**/*"),
+            watched: false,
+        });
     }
 
     // disable code coverage for labs package (but still run tests)

gulp/util/webpack-config.js

@@ -13,42 +13,36 @@ const globalName = (id) => upperFirst(camelCase(id));
 
 const DEFAULT_CONFIG = {
     devtool: "source-map",
-    module: {
-        loaders: [
-            // always provide JSON loader to support importing data files (see moment-timezone)
-            { loader: "json-loader", test: /\.json$/ },
-        ],
-    },
     plugins: [
         new webpack.DefinePlugin({
             "process.env": {
                 "NODE_ENV": process.env.NODE_ENV,
             },
         }),
     ],
-    resolve: { extensions: ["", ".js"] },
+    resolve: { extensions: [".js"] },
 };
 
 // Default webpack config options with support for TypeScript files
 const TYPESCRIPT_CONFIG = {
     devtool: "source-map",
     module: {
-        loaders: [
-            { loader: "json-loader", test: /\.json$/ },
-            { loader: "source-map-loader", test: /\.js$/ },
-            { loader: "ts-loader", test: /\.tsx?$/ },
+        rules: [
+            { test: /\.js$/, use: "source-map-loader" },
+            {
+                test: /\.tsx?$/,
+                use: [{
+                    loader: "ts-loader",
+                    options: {
+                        // do not emit declarations since we are bundling
+                        compilerOptions: { declaration: false },
+                    },
+                }],
+            },
         ],
     },
     resolve: {
-        extensions: ["", ".js", ".ts", ".tsx"],
-    },
-    ts: {
-        compilerOptions: {
-            // do not emit declarations since we are bundling
-            declaration: false,
-            // ensure that only @types from this project are used (instead of from local symlinked blueprint)
-            typeRoots: ["node_modules/@types"],
-        },
+        extensions: [".js", ".ts", ".tsx"],
     },
 };
 
@@ -61,6 +55,7 @@ const EXTERNALS = {
     "es6-shim": "window",
     "jquery": "$",
     "moment": "moment",
+    "moment-timezone": "moment",
     "react": "React",
     "react-addons-css-transition-group": "React.addons.CSSTransitionGroup",
     "react-day-picker": "DayPicker",
@@ -96,10 +91,10 @@ module.exports = {
             },
             externals: EXTERNALS,
             output: {
-                filename: `${project.id}.bundle.js`,
+                filename: `[name].bundle.js`,
                 library: ["Blueprint", globalName(project.id)],
                 libraryTarget: "umd",
-                path: path.join(project.cwd, "dist"),
+                path: path.resolve(project.cwd, "dist"),
             },
         }, DEFAULT_CONFIG);
 
@@ -115,30 +110,42 @@ module.exports = {
         return Object.assign({}, TYPESCRIPT_CONFIG, {
             devtool: "inline-source-map",
             entry: {
-                [project.id]: `./${project.cwd}/test/index`,
+                [project.id]: `./${project.cwd}/test/index.ts`,
             },
             // these externals necessary for Enzyme harness
             externals: {
                 "cheerio": "window",
                 "react/addons": true,
                 "react/lib/ExecutionEnvironment": true,
                 "react/lib/ReactContext": true,
+                "react-addons-test-utils": true,
             },
-            module: Object.assign({}, TYPESCRIPT_CONFIG.module, {
-                postLoaders: [
-                    {
-                        loader: "istanbul-instrumenter",
-                        test: /src\/.*\.tsx?$/,
-                    },
-                ],
-            }),
-            resolve: Object.assign({}, TYPESCRIPT_CONFIG.resolve, {
-                alias: {
-                    // webpack will load react twice because of symlinked node modules
-                    // this makes it only use one copy of React
-                    react: path.resolve(`./${project.cwd}/node_modules/react`),
-                },
-            }),
+            module: {
+                rules: TYPESCRIPT_CONFIG.module.rules.concat({
+                    enforce: "post",
+                    test: /src\/.*\.tsx?$/,
+                    use: "istanbul-instrumenter-loader",
+                }),
+            },
+            plugins: [
+                function() {
+                    this.plugin("done", function(stats) {
+                        if (stats.compilation.errors.length > 0) {
+                            // tslint:disable-next-line:no-console
+                            console.error("ERRORS in compilation. See above.");
+
+                            // Pretend no assets were generated. This prevents the tests
+                            // from running making it clear that there were errors.
+                            stats.stats = [{
+                                assets: [],
+                                toJson: function () { return this; }
+                            }];
+                        }
+                        return stats;
+                    });
+                }
+            ],
+            bail: true,
         });
     },
 
@@ -159,19 +166,12 @@ module.exports = {
             output: {
                 filename: `${project.id}.js`,
                 library: project.webpack.global,
-                path: `${project.cwd}/${project.webpack.dest}`,
+                path: path.resolve(project.cwd, project.webpack.dest),
             },
         }, TYPESCRIPT_CONFIG, {
             plugins: DEFAULT_CONFIG.plugins,
         });
 
-        if (project.webpack.localResolve != null) {
-            returnVal.resolve.alias = project.webpack.localResolve.reduce((obj, pkg) => {
-                obj[pkg] = path.resolve(`./${project.cwd}/node_modules/${pkg}`);
-                return obj;
-            }, {});
-        }
-
         return returnVal;
     },
 

gulp/webpack.js

@@ -16,7 +16,7 @@ module.exports = (blueprint, gulp) => {
 
     gulp.task("webpack-docs-watch", (callback) => {
         // rely on editor for compiler errors during development--this results in _massive_ speed increase
-        configuration.ts.transpileOnly = true;
+        configuration.module.rules[1].use[0].options.transpileOnly = true;
         // never invoke callback so it runs forever!
         webpack(configuration).watch({}, webpackConfig.webpackDone());
     });

lerna.json

@@ -1,5 +1,6 @@
 {
-  "lerna": "2.0.0",
+  "lerna": "2.4.0",
   "npmClient": "yarn",
+  "useWorkspaces": true,
   "version": "independent"
 }