Use Relative path for sku Config (#1028)

.changeset/stale-olives-hammer.md

@@ -0,0 +1,11 @@
+---
+'sku': patch
+---
+
+Fix incorrect path in ignore files when running `sku init`
+
+sku generates ignore files (e.g. `.eslintignore`) for the project.
+When ran as part of `sku init`, the current working directory (CWD) would sometimes be incorrect.
+It should now give the same result as `sku configure`.
+
+This change includes a refactor to how the webpack target directory is set in ignore files.

fixtures/sku-init/__snapshots__/sku-init.test.js.snap

@@ -0,0 +1,86 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`sku init should create .eslintignore 1`] = `
+"# managed by sku
+.eslintcache
+.eslintrc
+.prettierrc
+coverage/
+dist/
+pnpm-lock.yaml
+report/
+tsconfig.json
+# end managed by sku
+"
+`;
+
+exports[`sku init should create .gitignore 1`] = `
+"node_modules
+npm-debug.log
+
+# managed by sku
+.eslintcache
+.eslintrc
+.prettierrc
+coverage/
+dist/
+report/
+tsconfig.json
+# end managed by sku
+"
+`;
+
+exports[`sku init should create .prettierignore 1`] = `
+"# managed by sku
+.eslintcache
+.eslintrc
+.prettierrc
+coverage/
+dist/
+pnpm-lock.yaml
+report/
+tsconfig.json
+# end managed by sku
+"
+`;
+
+exports[`sku init should create package.json 1`] = `
+{
+  "dependencies": {
+    "braid-design-system": "VERSION_IGNORED",
+    "react": "VERSION_IGNORED",
+    "react-dom": "VERSION_IGNORED",
+  },
+  "devDependencies": {
+    "@types/react": "VERSION_IGNORED",
+    "@types/react-dom": "VERSION_IGNORED",
+    "@vanilla-extract/css": "VERSION_IGNORED",
+    "sku": "VERSION_IGNORED",
+  },
+  "name": "new-project",
+  "private": true,
+  "scripts": {
+    "build": "sku build",
+    "format": "sku format",
+    "lint": "sku lint",
+    "serve": "sku serve",
+    "start": "sku start",
+    "test": "sku test",
+  },
+  "version": "0.1.0",
+}
+`;
+
+exports[`sku init should create sku.config.ts 1`] = `
+"import type { SkuConfig } from 'sku';
+
+const skuConfig: SkuConfig = {
+  clientEntry: 'src/client.tsx',
+  renderEntry: 'src/render.tsx',
+  environments: ['development', 'production'],
+  publicPath: '/path/to/public/assets/', // <-- Required for sku build output
+};
+
+export default skuConfig;
+"
+`;

fixtures/sku-init/sku-init.test.js

@@ -9,62 +9,84 @@ const projectName = 'new-project';
 const projectDirectory = path.join(fixtureDirectory, projectName);
 
 describe('sku init', () => {
-  beforeAll(async () => {
-    await fs.rm(projectDirectory, { recursive: true, force: true });
-  });
-
-  afterAll(async () => {
-    await fs.rm(projectDirectory, { recursive: true, force: true });
-
-    console.log(
-      "Running 'pnpm install' to clean up lockfile after sku-init test...",
-    );
-    await exec('pnpm install');
-    console.log('Cleanup complete');
-  });
+  let child;
+  let stdout;
+  let stderr;
 
-  it(
-    'should create a sku.config.ts',
+  beforeAll(
     async () => {
+      await fs.rm(projectDirectory, { recursive: true, force: true });
+
       const projectName = 'new-project';
       await fs.rm(path.join(fixtureDirectory, projectName), {
         recursive: true,
         force: true,
       });
 
-      const { child, stdout, stderr } = await runSkuScriptInDir(
+      ({ child, stdout, stderr } = await runSkuScriptInDir(
         'init',
         fixtureDirectory,
         [projectName],
-      );
+      ));
 
       console.log('sku init stdout');
       console.log(stdout);
       console.log('sku init stderr');
       console.error(stderr);
+    },
+    // `sku init` is a long running task and can take some time to complete
+    5 * 60 * 1000,
+  );
+
+  afterAll(async () => {
+    await fs.rm(projectDirectory, { recursive: true, force: true });
+    console.log(
+      "Running 'pnpm install' to clean up lockfile after sku-init test...",
+    );
+    await exec('pnpm install');
+    console.log('Cleanup complete');
+  });
 
-      expect(child.exitCode).toBe(0);
+  it('should exit with code 0', async () => {
+    expect(child.exitCode).toBe(0);
+  });
 
-      const skuConfig = await fs.readFile(
-        path.join(fixtureDirectory, projectName, 'sku.config.ts'),
-        'utf-8',
-      );
+  it('should create package.json', async () => {
+    const contents = await fs.readFile(
+      path.join(fixtureDirectory, projectName, 'package.json'),
+      'utf-8',
+    );
 
-      expect(skuConfig).toMatchInlineSnapshot(`
-"import type { SkuConfig } from 'sku';
+    expect(replaceDependencyVersions(JSON.parse(contents))).toMatchSnapshot();
+  });
 
-const skuConfig: SkuConfig = {
-  clientEntry: 'src/client.tsx',
-  renderEntry: 'src/render.tsx',
-  environments: ['development', 'production'],
-  publicPath: '/path/to/public/assets/', // <-- Required for sku build output
-};
+  it.each(['sku.config.ts', '.gitignore', '.eslintignore', '.prettierignore'])(
+    'should create %s',
+    async (file) => {
+      const contents = await fs.readFile(
+        path.join(fixtureDirectory, projectName, file),
+        'utf-8',
+      );
 
-export default skuConfig;
-"
-`);
+      expect(contents).toMatchSnapshot();
     },
-    // `sku init` is a long running task and can take some time to complete
-    5 * 60 * 1000,
   );
 });
+
+/**
+ *
+ * When snapshot testing the package.json, we don't care about the specific versions of the dependencies.
+ */
+function replaceDependencyVersions(packageJson) {
+  const newPackageJson = structuredClone(packageJson);
+
+  for (const dep in newPackageJson.dependencies) {
+    newPackageJson.dependencies[dep] = 'VERSION_IGNORED';
+  }
+
+  for (const dep in newPackageJson.devDependencies) {
+    newPackageJson.devDependencies[dep] = 'VERSION_IGNORED';
+  }
+
+  return newPackageJson;
+}

packages/sku/lib/configure.js

@@ -4,7 +4,7 @@ const { writeFile, rm } = require('node:fs/promises');
 const path = require('node:path');
 
 const ensureGitignore = require('ensure-gitignore');
-const { cwd, getPathFromCwd } = require('./cwd');
+const { getPathFromCwd } = require('./cwd');
 
 const { paths, httpsDevServer, languages } = require('../context');
 const {
@@ -32,9 +32,7 @@ const writeFileToCWD = async (fileName, content, { banner = true } = {}) => {
 
 module.exports = async () => {
   // Ignore target directories
-  const webpackTargetDirectory = addSep(
-    paths.target.replace(addSep(cwd()), ''),
-  );
+  const webpackTargetDirectory = addSep(paths.relativeTarget);
 
   const gitIgnorePatterns = [
     // Ignore webpack bundle report output