Everybody gets a package

Author: ecraig12345

.eslintrc.json

@@ -1,4 +1,4 @@
 {
-  "extends": ["./packages/internal-tooling/eslint/index.js"],
+  "extends": ["./build/eslint/index.js"],
   "root": true
 }

build/.eslintrc.json

@@ -1,5 +1,5 @@
 {
-  "extends": ["../packages/internal-tooling/eslint/index.js"],
+  "extends": ["./eslint/index.js"],
   "rules": {
     "no-console": "off"
   },

packages/internal-tooling/babel/index.js renamed to build/babel/index.js

@@ -1,8 +1,8 @@
 import webpack from 'webpack'
 import config from '../../../config'
+import { log, PluginError } from 'gulp-util'
 
 const { __DEV__, __SKIP_ERRORS__ } = config.compiler_globals
-const { log, PluginError } = require('gulp-load-plugins')().util
 
 const DEV_SKIP_ERRORS = __DEV__ && __SKIP_ERRORS__
 

packages/internal-tooling/babel/register.js renamed to build/babel/register.js

@@ -2,13 +2,10 @@ import express from 'express'
 
 import historyApiFallback from 'connect-history-api-fallback'
 import { Server } from 'http'
+import { colors, log } from 'gulp-util'
 
 type Express = ReturnType<typeof express>
 
-const g = require('gulp-load-plugins')()
-
-const { colors, log } = g.util
-
 const serve = (
   directoryPath: string,
   host: string,

packages/internal-tooling/eslint/index.js renamed to build/eslint/index.js

@@ -1,14 +1,13 @@
 import { task, series, parallel, src, dest } from 'gulp'
 import babel from 'gulp-babel'
+import typescript from 'gulp-typescript'
 import rimraf from 'rimraf'
 import webpack from 'webpack'
 import { argv } from 'yargs'
 
 import config from '../../../config'
 import sh from '../sh'
 
-const g = require('gulp-load-plugins')()
-
 const { paths } = config
 const { log, PluginError } = g.util
 
@@ -51,21 +50,24 @@ task('bundle:package:commonjs', () =>
 
 task('bundle:package:es', () =>
   src(componentsSrc)
-    .pipe(babel({ caller: { useESModules: true } }))
+    .pipe(babel({ caller: { useESModules: true } } as any))
     .pipe(dest(paths.packageDist(packageName, 'es'))),
 )
 
 task('bundle:package:types', () => {
   const tsConfig = paths.base('build/tsconfig.json')
-  const typescript = g.typescript.createProject(tsConfig, {
+  const tsProject = typescript.createProject(tsConfig, {
     declaration: true,
     isolatedModules: false,
     module: 'esnext',
   })
 
-  return src(componentsSrc)
-    .pipe(typescript())
-    .dts.pipe(dest(paths.packageDist(packageName, 'es')))
+  return (
+    src(componentsSrc)
+      .pipe(tsProject())
+      // Write only the .d.ts files to dist/es (.js files are generated by bundle:package:es)
+      .dts.pipe(dest(paths.packageDist(packageName, 'es')))
+  )
 })
 
 task('bundle:package:umd', cb => {

build/gulp/plugins/gulp-webpack.ts

@@ -2,6 +2,7 @@ import { dest, lastRun, parallel, series, src, task, watch } from 'gulp'
 import chalk from 'chalk'
 import cache from 'gulp-cache'
 import remember from 'gulp-remember'
+import { log } from 'gulp-util'
 import fs from 'fs'
 import path from 'path'
 import rimraf from 'rimraf'
@@ -24,15 +25,12 @@ import { Server } from 'http'
 import serve, { forceClose } from '../serve'
 
 const { paths } = config
-const g = require('gulp-load-plugins')()
 
-const { log } = g.util
+const logWatchAdd = (filePath: string) => log('Created', chalk.blue(path.basename(filePath)))
+const logWatchChange = (filePath: string) => log('Changed', chalk.magenta(path.basename(filePath)))
+const logWatchUnlink = (filePath: string) => log('Deleted', chalk.red(path.basename(filePath)))
 
-const logWatchAdd = filePath => log('Created', chalk.blue(path.basename(filePath)))
-const logWatchChange = filePath => log('Changed', chalk.magenta(path.basename(filePath)))
-const logWatchUnlink = filePath => log('Deleted', chalk.red(path.basename(filePath)))
-
-const handleWatchUnlink = (group, filePath) => {
+const handleWatchUnlink = (group: any, filePath: string) => {
   logWatchUnlink(filePath)
   remember.forget(group, filePath)
 }
@@ -220,7 +218,7 @@ task('serve:docs:hot', async () => {
           noInfo: true, // must be quite for hot middleware to show overlay
           lazy: false,
           stats: config.compiler_stats,
-        }),
+        } as WebpackDevMiddleware.Options),
       )
       .use(WebpackHotMiddleware(compiler)),
   )

build/gulp/serve.ts

@@ -1,6 +1,7 @@
 import express from 'express'
 import fs from 'fs'
 import { series, task } from 'gulp'
+import { colors, log } from 'gulp-util'
 import _ from 'lodash'
 import ProgressBar from 'progress'
 import puppeteer from 'puppeteer'
@@ -20,7 +21,6 @@ import webpackPlugin from '../plugins/gulp-webpack'
 import { safeLaunchOptions } from 'build/puppeteer.config'
 
 const { paths } = config
-const { colors, log } = require('gulp-load-plugins')().util
 
 const DEFAULT_RUN_TIMES = 10
 let server

build/gulp/tasks/bundle.ts

@@ -1,5 +1,6 @@
 import fs from 'fs'
 import { task, parallel, series } from 'gulp'
+import { log, PluginError } from 'gulp-util'
 import _ from 'lodash'
 import webpack from 'webpack'
 import stableStringify from 'json-stable-stringify-without-jsonify'
@@ -8,10 +9,7 @@ import requestHttp from 'request-promise-native'
 
 import config from '../../../config'
 
-const g = require('gulp-load-plugins')()
-
 const { paths } = config
-const { log, PluginError } = g.util
 
 const UNRELEASED_VERSION_STRING = 'Unreleased'
 const SEMVER_MATCHER = /(\d+)\.(\d+)\.(\d+)/

build/gulp/tasks/docs.ts

@@ -47,11 +47,14 @@ const packProjectPackages = async (logger: Function): Promise<PackedPackages> =>
   const projectPackages = lernaAliases({ sourceDirectory: false })
 
   // We don't want to pack a package with our dev tools
+  delete projectPackages['@fluentui/digest']
+  delete projectPackages['@fluentui/docs']
+  delete projectPackages['@fluentui/e2e']
   delete projectPackages['@fluentui/eslint-plugin']
   delete projectPackages['@fluentui/internal-tooling']
-  delete projectPackages['@fluentui/scripts']
-  delete projectPackages['@fluentui/digest']
+  delete projectPackages['@fluentui/perf']
   delete projectPackages['@fluentui/perf-test']
+  delete projectPackages['@fluentui/scripts']
 
   await Promise.all(
     Object.keys(projectPackages).map(async (packageName: string) => {

build/gulp/tasks/perf.ts

@@ -0,0 +1,86 @@
+{
+  "name": "@fluentui/internal-tooling",
+  "version": "0.42.0",
+  "license": "MIT",
+  "dependencies": {
+    "@babel/core": "^7.6.4",
+    "@babel/plugin-proposal-class-properties": "^7.5.5",
+    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
+    "@babel/plugin-transform-runtime": "^7.6.2",
+    "@babel/preset-env": "^7.6.3",
+    "@babel/preset-react": "^7.6.3",
+    "@babel/preset-typescript": "^7.6.0",
+    "@babel/register": "^7.4.4",
+    "@babel/standalone": "^7.3.2",
+    "@fluentui/eslint-plugin": "^0.42.0",
+    "@mdx-js/loader": "^1.0.21",
+    "@types/babel__traverse": "^7.0.4",
+    "@types/express": "^4.16.1",
+    "@types/gulp": "^4.0.6",
+    "@types/gulp-babel": "6.1.29",
+    "@types/gulp-cache": "^0.4.4",
+    "@types/gulp-util": "^3.0.34",
+    "@types/gulp-remember": "^0.0.31",
+    "@types/jest-axe": "^2.2.3",
+    "@types/jest": "^24.0.19",
+    "@types/node": "^10.3.2",
+    "@types/puppeteer": "^1.11.1",
+    "@types/rimraf": "^2.0.2",
+    "@types/webpack-dev-middleware": "^2.0.1",
+    "@types/webpack-hot-middleware": "^2.16.3",
+    "@typescript-eslint/eslint-plugin": "^2.5.0",
+    "@typescript-eslint/parser": "^2.5.0",
+    "babel-jest": "^24.5.0",
+    "babel-loader": "^8.0.6",
+    "babel-plugin-lodash": "^3.3.4",
+    "circular-dependency-plugin": "^5.0.2",
+    "clean-webpack-plugin": "^0.1.19",
+    "connect-history-api-fallback": "^1.3.0",
+    "copy-webpack-plugin": "^4.5.2",
+    "doctrine": "^2.0.0",
+    "eslint": "^6.5.1",
+    "eslint-config-airbnb": "^17.1.0",
+    "eslint-config-prettier": "^4.1.0",
+    "eslint-plugin-import": "^2.18.2",
+    "eslint-plugin-jest": "^22.4.1",
+    "eslint-plugin-jsx-a11y": "^6.2.1",
+    "eslint-plugin-react-hooks": "^2.1.2",
+    "eslint-plugin-react": "^7.16.0",
+    "express": "^4.15.4",
+    "extract-comments": "^1.0.0",
+    "fork-ts-checker-webpack-plugin": "^1.3.3",
+    "glob": "^7.1.2",
+    "gulp": "^4.0.2",
+    "gulp-babel": "^8.0.0",
+    "gulp-cache": "^1.0.2",
+    "gulp-remember": "^1.0.1",
+    "gulp-typescript": "^5.0.0",
+    "gulp-util": "^3.0.8",
+    "html-webpack-plugin": "^4.0.0-beta.5",
+    "jest": "^24.9.0",
+    "jest-axe": "^3.1.1",
+    "jest-react-fela": "^10.6.1",
+    "json-stable-stringify-without-jsonify": "^1.0.1",
+    "license-webpack-plugin": "^2.1.1",
+    "portfinder": "^1.0.20",
+    "prettier": "^1.19.1",
+    "progress": "^2.0.3",
+    "puppeteer": "^1.11.0",
+    "react-hot-loader": "^4.12.15",
+    "react-vis": "^1.11.6",
+    "read-package-json": "^2.0.13",
+    "request-promise-native": "^1.0.5",
+    "rimraf": "^2.6.1",
+    "semver": "^6.2.0",
+    "through2": "^2.0.3",
+    "tmp": "^0.0.33",
+    "tsconfig-paths": "^3.7.0",
+    "webpack": "^4.35.0",
+    "webpack-bundle-analyzer": "^3.3.2",
+    "webpack-dev-middleware": "^3.6.2",
+    "webpack-hot-middleware": "^2.24.3"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

build/gulp/tasks/stats.ts

@@ -36,30 +36,37 @@ const envConfig = {
 // ------------------------------------
 // Paths
 // ------------------------------------
-const base = (...args) => path.resolve(...[envConfig.path_base, ...args])
+const base = (...paths: string[]) => path.resolve(envConfig.path_base, ...paths)
+const fromBase = (...paths: string[]) => (...subPaths: string[]) => base(...paths, ...subPaths)
 
-const paths = {
-  base,
-  build: base.bind(null, envConfig.dir_build),
-  docsDist: base.bind(null, envConfig.dir_docs_dist),
-  docsSrc: base.bind(null, envConfig.dir_docs_src),
-  e2e: base.bind(null, envConfig.dir_e2e),
-  e2eSrc: base.bind(null, envConfig.dir_e2e_src),
-  e2eDist: base.bind(null, envConfig.dir_e2e_dist),
+const tempPaths = {
+  build: fromBase(envConfig.dir_build),
+  docsDist: fromBase(envConfig.dir_docs_dist),
+  docsSrc: fromBase(envConfig.dir_docs_src),
+  e2e: fromBase(envConfig.dir_e2e),
+  e2eSrc: fromBase(envConfig.dir_e2e_src),
+  e2eDist: fromBase(envConfig.dir_e2e_dist),
   packageDist: (packageName: string, ...paths: string[]) =>
     base(envConfig.dir_packages, packageName, 'dist', ...paths),
   packageSrc: (packageName: string, ...paths: string[]) =>
     base(envConfig.dir_packages, packageName, 'src', ...paths),
-  packages: base.bind(null, envConfig.dir_packages),
-  perfDist: base.bind(null, envConfig.dir_perf_dist),
-  perfSrc: base.bind(null, envConfig.dir_perf_src),
-  umdDist: base.bind(null, envConfig.dir_umd_dist),
-  ciArtifacts: base.bind(null, envConfig.dir_ci_artifacts),
-  withRootAt: (root, ...subpaths) => (...args) => path.resolve(root, ...subpaths, ...args),
-  posix: undefined, // all the sibling values, but with forward slashes regardless the OS
+  packages: fromBase(envConfig.dir_packages),
+  perfDist: fromBase(envConfig.dir_perf_dist),
+  perfSrc: fromBase(envConfig.dir_perf_src),
+  umdDist: fromBase(envConfig.dir_umd_dist),
+  ciArtifacts: fromBase(envConfig.dir_ci_artifacts),
+  withRootAt: (root: string, ...subpaths: string[]) => (...args: string[]) =>
+    path.resolve(root, ...subpaths, ...args),
 }
 
-paths.posix = _.mapValues(paths, func => (...args) => func(...args).replace(/\\/g, '/'))
+const paths = {
+  base,
+  ...tempPaths,
+  // all the sibling values, but with forward slashes regardless the OS
+  posix: _.mapValues(tempPaths, (func: (...args: string[]) => string) => (...args: string[]) =>
+    func(...args).replace(/\\/g, '/'),
+  ),
+}
 
 const config = {
   ...envConfig,

build/gulp/tasks/test-projects.ts

@@ -1,5 +1,5 @@
 {
-  "extends": ["../packages/internal-tooling/eslint/index.js"],
+  "extends": ["@fluentui/internal-tooling/eslint/index.js"],
   "rules": {
     "no-alert": "off"
   },

packages/internal-tooling/jest/index.js renamed to build/jest/index.js

@@ -0,0 +1,37 @@
+{
+  "name": "@fluentui/docs",
+  "version": "0.42.0",
+  "private": true,
+  "license": "MIT",
+  "dependencies": {
+    "color": "^3.1.0",
+    "copy-to-clipboard": "^3.0.8",
+    "faker": "^4.1.0",
+    "flat": "^4.1.0",
+    "react-ace": "^5.1.2",
+    "react-codesandboxer": "^3.1.3",
+    "react-custom-scrollbars": "^4.2.1",
+    "react-document-title": "^2.0.3",
+    "react-element-to-jsx-string": "^14.0.2",
+    "react-hot-loader": "^4.12.15",
+    "react-markdown": "^4.0.8",
+    "react-router-dom": "^5.0.1",
+    "react-source-render": "4.0.0-1",
+    "react-virtualized": "^9.21.1",
+    "react-vis": "^1.11.6"
+
+  },
+  "devDependencies": {
+    "@fluentui/internal-tooling": "^0.42.0",
+    "@types/color": "^3.0.0",
+    "@types/faker": "^4.1.3",
+    "@types/gulp": "^4.0.6",
+    "@types/node": "^10.3.2",
+    "@types/react-custom-scrollbars": "^4.0.5",
+    "@types/react-router-dom": "^4.3.4",
+    "gulp": "^4.0.2"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

packages/internal-tooling/jest/setupTests.js renamed to build/jest/setupTests.js

@@ -0,0 +1,17 @@
+{
+  "name": "@fluentui/e2e",
+  "version": "0.42.0",
+  "private": true,
+  "license": "MIT",
+  "devDependencies": {
+    "@fluentui/internal-tooling": "^0.42.0",
+    "@fluentui/react": "^0.42.0",
+    "@types/puppeteer": "^1.11.1",
+    "@types/react-router-dom": "^4.3.4",
+    "puppeteer": "^1.11.0",
+    "react-router-dom": "^5.0.1"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

build/package.json

@@ -1,7 +1,8 @@
 {
   "extends": "../build/tsconfig.common.json",
   "compilerOptions": {
-    "module": "esnext"
+    "module": "esnext",
+    "allowSyntheticDefaultImports": true
   },
   "include": ["../packages/react/src", "../e2e", "../types"]
 }