Refine rollup config (#43) #41

* feat: update rollup config

* test: added babel test :(

* test: added rollup test :(

* feat: camelcase appname

* docs: updage changelog

CHANGELOG.md

@@ -1,3 +1,8 @@
+# V0.2.1
+
+- Renew rollup config
+- Added runtim plugin for babel
+
 # V0.2.0
 
 - Added esbuild feature for build typescript

jest.config.ts

@@ -5,7 +5,7 @@ const config: Config.InitialOptions = {
   verbose: true,
   preset: 'ts-jest',
   testEnvironment: 'node',
-  coveragePathIgnorePatterns: ['/node_modules/', '/test/', '__test__', 'dist'],
+  coveragePathIgnorePatterns: ['/node_modules/', '/tests/', '__tests__', 'dist'],
   collectCoverageFrom: ['src/**/*.{js,ts}']
 }
 

package.json

@@ -46,6 +46,7 @@
     "fs-extra": "^9.1.0",
     "inquirer": "^8.0.0",
     "lint-staged": "^10.5.4",
+    "lodash.camelcase": "^4.3.0",
     "ora": "^5.4.0",
     "prettier": "^2.2.1",
     "tslib": "^2.2.0",
@@ -59,6 +60,7 @@
     "@types/glob": "^7.1.3",
     "@types/inquirer": "^7.3.1",
     "@types/jest": "^26.0.22",
+    "@types/lodash.camelcase": "^4.3.6",
     "@types/node": "^14.14.41",
     "@types/prettier": "^2.2.3",
     "@types/yargs": "^16.0.1",

src/features/babel/__tests__/babel.spec.ts

@@ -0,0 +1,101 @@
+import path from 'path'
+import fs from 'fs-extra'
+import { isSkip, setup } from '../index'
+import { DependencyType, getDepsCollection, clearDeps } from '../../../core/dependency'
+import { BUILD_TOOLS } from '../../typescript/build-tools'
+
+const rootPath = path.resolve(__dirname, 'tmp')
+describe('As chore eslint feature', () => {
+  beforeEach(async () => {
+    clearDeps()
+    await fs.ensureDir(rootPath)
+  })
+
+  afterEach(async () => {
+    await fs.remove(rootPath)
+  })
+
+  it('should skip install this feature when project has exists babel config file', async () => {
+    const eslintPath = path.resolve(rootPath, '.babelrc')
+    await fs.ensureFile(eslintPath)
+    const context = { rootPath, answers: {} }
+    const skiped = await isSkip(context)
+    expect(skiped).toBe(true)
+  })
+
+  it('should skip this feature when given special build tool', async () => {
+    const skiped = await isSkip({ rootPath, answers: { buildTool: BUILD_TOOLS.TSC } })
+    expect(skiped).toBe(true)
+
+    const skiped1 = await isSkip({ rootPath, answers: { buildTool: BUILD_TOOLS.ESBUILD } })
+    expect(skiped1).toBe(true)
+
+    const skiped2 = await isSkip({ rootPath, answers: { buildTool: BUILD_TOOLS.ROLLUP } })
+    expect(skiped2).toBe(false)
+
+    const skiped3 = await isSkip({ rootPath, answers: { buildTool: BUILD_TOOLS.WEBPACK } })
+    expect(skiped3).toBe(false)
+  })
+
+  it('should write babel config to project root when setup has been called with no react', async () => {
+    const babelrcPath = path.resolve(rootPath, '.babelrc')
+    const context = { rootPath, answers: {} }
+    await setup(context)
+
+    const configContent = await fs.readJSON(babelrcPath)
+    expect(configContent).toStrictEqual({
+      presets: ['@babel/preset-env', '@babel/preset-typescript'],
+      plugins: [
+        '@babel/plugin-transform-runtime',
+        '@babel/proposal-class-properties',
+        '@babel/proposal-object-rest-spread'
+      ]
+    })
+
+    const deps = getDepsCollection()
+    const expectedDependencies = [
+      '@babel/cli',
+      '@babel/core',
+      '@babel/preset-env',
+      '@babel/plugin-proposal-class-properties',
+      '@babel/plugin-proposal-object-rest-spread',
+      '@babel/preset-typescript',
+      '@babel/plugin-transform-runtime'
+    ].map(item => ({ name: item, type: DependencyType.DEV }))
+
+    expectedDependencies.push({ name: '@babel/runtime', type: DependencyType.DEFAULT })
+
+    expect(deps).toStrictEqual(expectedDependencies)
+  })
+
+  it('should write babel config to project root when setup has been called with react needed', async () => {
+    const eslintPath = path.resolve(rootPath, '.babelrc')
+    const context = { rootPath, answers: { isReactNeeded: true } }
+    await setup(context)
+
+    const configContent = await fs.readJSON(eslintPath)
+    expect(configContent).toStrictEqual({
+      presets: ['@babel/preset-env', '@babel/preset-typescript', '@babel/preset-react'],
+      plugins: [
+        '@babel/plugin-transform-runtime',
+        '@babel/proposal-class-properties',
+        '@babel/proposal-object-rest-spread'
+      ]
+    })
+
+    const deps = getDepsCollection()
+    const expectedDependencies = [
+      '@babel/cli',
+      '@babel/core',
+      '@babel/preset-env',
+      '@babel/plugin-proposal-class-properties',
+      '@babel/plugin-proposal-object-rest-spread',
+      '@babel/preset-typescript',
+      '@babel/plugin-transform-runtime'
+    ].map(item => ({ name: item, type: DependencyType.DEV }))
+
+    expectedDependencies.push({ name: '@babel/runtime', type: DependencyType.DEFAULT })
+    expectedDependencies.push({ name: '@babel/preset-react', type: DependencyType.DEV })
+    expect(deps).toStrictEqual(expectedDependencies)
+  })
+})

src/features/babel/index.ts

@@ -1,11 +1,17 @@
 import type { FeatureSetup, IsSkipFeature } from '../../types'
 import { resolve } from 'path'
 import { BUILD_TOOLS } from '../typescript/build-tools'
-import { addDevDeps } from '../../core/dependency'
+import { addDep, addDevDeps } from '../../core/dependency'
 import { rederTemplate } from '../../core/template'
+import { fileExists } from '../../utils/path_helper'
 
-export const isSkip: IsSkipFeature = async ({ answers }) => {
-  return [BUILD_TOOLS.TSC, BUILD_TOOLS.ESBUILD].includes(answers.buildTool)
+const configFileExists = async (path: string) => await fileExists(resolve(path, '.babelrc'))
+
+export const isSkip: IsSkipFeature = async ({ rootPath, answers }) => {
+  return (
+    (await configFileExists(rootPath)) ||
+    [BUILD_TOOLS.TSC, BUILD_TOOLS.ESBUILD].includes(answers.buildTool)
+  )
 }
 
 export const setup: FeatureSetup = async context => {
@@ -18,9 +24,12 @@ export const setup: FeatureSetup = async context => {
     '@babel/preset-env',
     '@babel/plugin-proposal-class-properties',
     '@babel/plugin-proposal-object-rest-spread',
-    '@babel/preset-typescript'
+    '@babel/preset-typescript',
+    '@babel/plugin-transform-runtime'
   ])
 
+  addDep('@babel/runtime')
+
   if (isReactNeeded) {
     addDevDeps(['@babel/preset-react'])
   }

src/features/babel/templates/.babelrc.tpl

@@ -9,6 +9,7 @@
     <% } %>
   ],
   "plugins": [
+    "@babel/plugin-transform-runtime",
     "@babel/proposal-class-properties",
     "@babel/proposal-object-rest-spread"
   ]

src/features/boilerplate/templates/index.spec.ts.tpl

@@ -1,5 +1,5 @@
-import sum from '../src/index';
+import sum from '../src/index'
 
 test('sum should return 2 when given 1 1', () => {
-  expect(sum(1, 1)).toBe(2);
+  expect(sum(1, 1)).toBe(2)
 })

src/features/boilerplate/templates/index.ts.tpl

@@ -1,3 +1,3 @@
- export default function sum(a: number, b: number) {
-   return a + b;
- }
+export default function sum(a: number, b: number) {
+  return a + b
+}

src/features/rollup/__tests__/rollup.spec.ts

@@ -0,0 +1,54 @@
+import path from 'path'
+import fs from 'fs-extra'
+import { isSkip, setup } from '../index'
+import { DependencyType, getDepsCollection, clearDeps } from '../../../core/dependency'
+import { BUILD_TOOLS } from '../../typescript/build-tools'
+
+const rootPath = path.resolve(__dirname, 'tmp')
+describe('As chore eslint feature', () => {
+  beforeEach(async () => {
+    clearDeps()
+    await fs.ensureDir(rootPath)
+  })
+
+  afterEach(async () => {
+    await fs.remove(rootPath)
+  })
+
+  it('should skip install this feature when project has exists rollup config file', async () => {
+    const rollupConfigPath = path.resolve(rootPath, 'rollup.config.ts')
+    await fs.ensureFile(rollupConfigPath)
+    const context = { rootPath, answers: {} }
+    const skiped = await isSkip(context)
+    expect(skiped).toBe(true)
+  })
+
+  it('should skip this feature when given special build tool', async () => {
+    const skiped = await isSkip({ rootPath, answers: { buildTool: BUILD_TOOLS.TSC } })
+    expect(skiped).toBe(true)
+
+    const skiped1 = await isSkip({ rootPath, answers: { buildTool: BUILD_TOOLS.ESBUILD } })
+    expect(skiped1).toBe(true)
+
+    const skiped2 = await isSkip({ rootPath, answers: { buildTool: BUILD_TOOLS.ROLLUP } })
+    expect(skiped2).toBe(false)
+
+    const skiped3 = await isSkip({ rootPath, answers: { buildTool: BUILD_TOOLS.WEBPACK } })
+    expect(skiped3).toBe(true)
+  })
+
+  it('should write rollup config to project root when setup has been called', async () => {
+    const context = { rootPath, answers: {} }
+    await setup(context)
+
+    const deps = getDepsCollection()
+    const expectedDependencies = [
+      'rollup',
+      '@rollup/plugin-babel',
+      '@rollup/plugin-node-resolve',
+      '@rollup/plugin-commonjs'
+    ].map(item => ({ name: item, type: DependencyType.DEV }))
+
+    expect(deps).toStrictEqual(expectedDependencies)
+  })
+})

src/features/rollup/index.ts

@@ -1,5 +1,6 @@
 import type { FeatureSetup, IsSkipFeature } from '../../types'
 import { resolve } from 'path'
+import camelCase from 'lodash.camelcase'
 import { BUILD_TOOLS } from '../typescript/build-tools'
 import { addDevDeps } from '../../core/dependency'
 import { rederTemplate } from '../../core/template'
@@ -13,18 +14,23 @@ export const isSkip: IsSkipFeature = async ({ rootPath, answers }) => {
 }
 
 export const setup: FeatureSetup = async context => {
-  const { rootPath } = context
+  const {
+    rootPath,
+    answers: { packageName }
+  } = context
 
   addDevDeps([
     'rollup',
     '@rollup/plugin-babel',
     '@rollup/plugin-node-resolve',
-    '@rollup/plugin-commonjs',
-    'rollup-plugin-sourcemaps'
+    '@rollup/plugin-commonjs'
   ])
 
   await rederTemplate(
     resolve(rootPath, 'rollup.config.ts'),
-    resolve(__dirname, './templates/rollup.config.ts.tpl')
+    resolve(__dirname, './templates/rollup.config.ts.tpl'),
+    {
+      appName: camelCase(packageName)
+    }
   )
 }

src/features/rollup/templates/rollup.config.ts.tpl

@@ -1,7 +1,6 @@
 import commonjs from '@rollup/plugin-commonjs'
-import { nodeResolve } from '@rollup/plugin-node-resolve'
+import resolve from '@rollup/plugin-node-resolve'
 import babel from '@rollup/plugin-babel'
-import sourceMaps from 'rollup-plugin-sourcemaps'
 import pkg from './package.json'
 
 export default {
@@ -16,20 +15,22 @@ export default {
   plugins: [
     // Allows node_modules resolution
     // https://github.com/rollup/rollup-plugin-node-resolve#usage
-    nodeResolve(),
+    resolve(),
 
     // Allow bundling cjs modules. Rollup doesn't understand cjs
-    commonjs(),
+    commonjs({ include: 'node_modules/**' }),
 
     // Compile TypeScript/JavaScript files
-    babel({ extensions: ['.js', '.jsx', '.es6', '.es', '.mjs', '.ts', '.tsx'], include: ['src/**/*'], babelHelpers: 'runtime' }),
-
-    // Resolve source maps to the original source
-    sourceMaps()
+    babel({
+      extensions: ['.ts', '.tsx', '.js', '.jsx', '.es6', '.es', '.mjs'],
+      include: ['src/**/*'],
+      exclude: 'node_modules/**',
+      babelHelpers: 'runtime'
+    })
   ],
 
   output: [
-    { file: pkg.main, name: '<LIBRARY_NAME>', format: 'umd', sourcemap: true },
+    { file: pkg.main, name: '<%= appName %>', format: 'umd', sourcemap: true },
     { file: pkg.module, format: 'es', sourcemap: true }
   ]
 }

src/features/typescript/build-tools.ts

@@ -27,6 +27,6 @@ export const buildTools = () => {
     name: 'buildTool',
     message: '🛠  Which build tool do you want to use?',
     choices,
-    default: BUILD_TOOLS.ESBUILD
+    default: BUILD_TOOLS.TSC
   }
 }