@jsenv/core 39.1.3 → 39.2.1

package/README.md

@@ -10,29 +10,32 @@ Jsenv is a suite of tools that can be used in projects involving JavaScript.
 4. **test runner**; execute all test files at once
 
 It favors standards and simplicity.  
-As a result it can be enjoyed by people without much experience in tooling or seeking for simple tools without hidden complexities
+As a result it can be enjoyed by people without much experience in tooling or seeking for simple tools without hidden complexities.
 
-Now what do you want to do?
+If you want to try jsenv on your machine, use [#CLI](#cli).
 
-| Scenario                                              | Action                                               |
-| ----------------------------------------------------- | ---------------------------------------------------- |
-| I want to try a demo on my machine                    | Go to [./demos](#demos)                              |
-| I want to try jsenv on a project I have on my machine | Go to [./cli](#cli)                                  |
-| I want to learn how to use jsenv                      | Go to [./docs/users/users.md](./docs/users/users.md) |
+Link to [documentation](./docs/users/users.md)
 
-# Demos
+# CLI
+
+The following command helps to init jsenv on your machine.
+
+```console
+npm @jsenv/cli
+```
 
-A demo is a project pre-configured with jsenv.  
-The following command can be used to install and try a demo:
+CLI will init jsenv in a directory. It can be a new directory or an existing one.
 
 ```console
-npm create jsenv@latest
+Welcome in jsenv CLI
+? Enter a directory: ›
 ```
 
-It will prompt to choose one of the available demo:
+Then you'll be prompted to select a template.
 
 ```console
-? Select a demo: › - Use arrow-keys. Return to submit.
+✔ Enter a directory: › demo
+? Select a template: › - Use arrow-keys. Return to submit.
 ❯   web
     web-components
     web-react
@@ -40,41 +43,27 @@ It will prompt to choose one of the available demo:
     node-package
 ```
 
-Selecting "web" will copy [create-jsenv/demo-web/](./packages/related/create-jsenv/demo-web/) files into a directory:
+A template is a project pre-configured with jsenv.  
+Selecting "web" would init [demo-web/](./packages/related/cli/demo-web/):
 
 ```console
-✔ Select a demo: › web
-✔ copy demo files into "[...]jsenv-demo-web/" (done in 0.1 second)
------ commands to run -----
-cd jsenv-demo-web
+✔ Enter a directory: › demo
+✔ Select a template: › web
+✔ init jsenv in "[...]/demo/" (done in 0.01 second)
+----- 2 commands to run -----
+cd demo
 npm install
-npm start
----------------------------
+-----------------------------
 ```
 
-After running the suggested commands the demo is ready.
-
-The demo contains preconfigured scripts:
+The templates have installed scripts:
 
 - `npm run dev`: starts a server for source files; Documented in [B) Dev](./docs/users/b_dev/b_dev.md).
 - `npm run build`: generate build files; Documented in [C) Build](./docs/users/c_build/c_build.md).
 - `npm run build:serve`: start a server for build files; Documented in [C) Build#how-to-serve-build-files](./docs/users/c_build/c_build.md#3-how-to-serve-build-files).
 - `npm run test`: execute test files; Documented in [D) Test](./docs/users/d_test/d_test.md).
 
-# CLI
-
-Jsenv commands to test it quickly.
-
-| I want to                             | Command                  |
-| ------------------------------------- | ------------------------ |
-| Start a local server for source files | `npx @jsenv/cli dev`     |
-| Build source files into "./dist/"     | `npx @jsenv/cli build`   |
-| Start a local server for build files  | `npx @jsenv/cli preview` |
-| Run all test files                    | `npx @jsenv/cli test`    |
-
-The commands are very basic, for advanced use cases you should use jsenv API.
-
-For example in order to start a dev server you would rather do `npm run dev` that would be declared in [package.json#scripts.dev](./packages/related/create-jsenv/demo-web/package.json#L8) to execute [scripts/dev.mjs](./packages/related/create-jsenv/demo-web/scripts/dev.mjs).
+<!-- For example in order to start a dev server you would rather do `npm run dev` that would be declared in [package.json#scripts.dev](./packages/related/create-jsenv/demo-web/package.json#L8) to execute [scripts/dev.mjs](./packages/related/create-jsenv/demo-web/scripts/dev.mjs). -->
 
 # The best parts
 

package/dist/jsenv_core.js

@@ -2092,18 +2092,26 @@ const setUrlFilename = (url, filename) => {
 };
 
 const ensurePathnameTrailingSlash = (url) => {
-  const urlObject = new URL(url);
-  const { pathname } = urlObject;
-  if (pathname.endsWith("/")) {
-    return url;
+  if (typeof url === "string") {
+    const urlObject = new URL(url);
+    const { pathname } = urlObject;
+    if (pathname.endsWith("/")) {
+      return url;
+    }
+    let { origin } = urlObject;
+    // origin is "null" for "file://" urls with Node.js
+    if (origin === "null" && urlObject.href.startsWith("file:")) {
+      origin = "file://";
+    }
+    const { search, hash } = urlObject;
+    const urlWithTrailingSlash = `${origin}${pathname}/${search}${hash}`;
+    return urlWithTrailingSlash;
   }
-  let { origin } = urlObject;
-  // origin is "null" for "file://" urls with Node.js
-  if (origin === "null" && urlObject.href.startsWith("file:")) {
-    origin = "file://";
+  if (url.pathname.endsWith("/")) {
+    return url;
   }
-  const { search, hash } = urlObject;
-  return `${origin}${pathname}/${search}${hash}`;
+  url.pathname += "/";
+  return url;
 };
 
 const isFileSystemPath$1 = (value) => {
@@ -11558,6 +11566,7 @@ const createDependencies = (ownerUrlInfo) => {
     isOriginalPosition,
     specifierLine,
     specifierColumn,
+    content,
     ...rest
   }) => {
     const parentUrl = isOriginalPosition
@@ -11578,6 +11587,7 @@ const createDependencies = (ownerUrlInfo) => {
       specifierLine,
       specifierColumn,
       isInline: true,
+      content,
       ...rest,
     });
     return reference;
@@ -11905,6 +11915,12 @@ const createReference = ({
     ownerUrlInfo = reference.ownerUrlInfo,
     ...props
   }) => {
+    const content =
+      ownerUrlInfo === undefined
+        ? isOriginalPosition
+          ? reference.ownerUrlInfo.originalContent
+          : reference.ownerUrlInfo.content
+        : ownerUrlInfo.content;
     const trace = traceFromUrlSite({
       url:
         ownerUrlInfo === undefined
@@ -11912,12 +11928,7 @@ const createReference = ({
             ? reference.ownerUrlInfo.url
             : reference.ownerUrlInfo.generatedUrl
           : reference.ownerUrlInfo.url,
-      content:
-        ownerUrlInfo === undefined
-          ? isOriginalPosition
-            ? reference.ownerUrlInfo.originalContent
-            : reference.ownerUrlInfo.content
-          : ownerUrlInfo.content,
+      content,
       line,
       column,
     });
@@ -12114,14 +12125,15 @@ const applyDependencyRemovalEffects = (reference) => {
 };
 
 const traceFromUrlSite = (urlSite) => {
+  const codeFrame = urlSite.content
+    ? generateContentFrame({
+        content: urlSite.content,
+        line: urlSite.line,
+        column: urlSite.column,
+      })
+    : "";
   return {
-    codeFrame: urlSite.content
-      ? generateContentFrame({
-          content: urlSite.content,
-          line: urlSite.line,
-          column: urlSite.column,
-        })
-      : "",
+    codeFrame,
     message: stringifyUrlSite(urlSite),
     url: urlSite.url,
     line: urlSite.line,
@@ -12131,7 +12143,7 @@ const traceFromUrlSite = (urlSite) => {
 
 const adjustUrlSite = (urlInfo, { url, line, column }) => {
   const isOriginal = url === urlInfo.url;
-  const adjust = (urlSite, urlInfo) => {
+  const adjust = (urlInfo, urlSite) => {
     if (!urlSite.isOriginal) {
       return urlSite;
     }
@@ -12140,33 +12152,35 @@ const adjustUrlSite = (urlInfo, { url, line, column }) => {
       return urlSite;
     }
     const parentUrlInfo = urlInfo.graph.getUrlInfo(inlineUrlSite.url);
-    return adjust(
-      {
-        isOriginal: true,
-        url: inlineUrlSite.url,
-        content: inlineUrlSite.content,
-        line:
-          inlineUrlSite.line === undefined
-            ? urlSite.line
-            : inlineUrlSite.line + urlSite.line,
-        column:
-          inlineUrlSite.column === undefined
-            ? urlSite.column
-            : inlineUrlSite.column + urlSite.column,
-      },
-      parentUrlInfo,
-    );
-  };
-  return adjust(
-    {
-      isOriginal,
-      url,
-      content: isOriginal ? urlInfo.originalContent : urlInfo.content,
+    line =
+      inlineUrlSite.line === undefined
+        ? urlSite.line
+        : inlineUrlSite.line + urlSite.line;
+    // we remove 1 to the line because imagine the following html:
+    // <style>body { color: red; }</style>
+    // -> content starts same line as <style> (same for <script>)
+    if (urlInfo.content[0] === "\n") {
+      line = line - 1;
+    }
+    column =
+      inlineUrlSite.column === undefined
+        ? urlSite.column
+        : inlineUrlSite.column + urlSite.column;
+    return adjust(parentUrlInfo, {
+      isOriginal: true,
+      url: inlineUrlSite.url,
+      content: inlineUrlSite.content,
       line,
       column,
-    },
-    urlInfo,
-  );
+    });
+  };
+  return adjust(urlInfo, {
+    isOriginal,
+    url,
+    content: isOriginal ? urlInfo.originalContent : urlInfo.content,
+    line,
+    column,
+  });
 };
 
 const getRedirectedReferenceProps = (reference, url) => {
@@ -13686,13 +13700,16 @@ const createResolveUrlError = ({
     ...details
   }) => {
     const resolveError = new Error(
-      createDetailedMessage$1(`Failed to resolve url reference`, {
-        reason,
-        ...details,
-        "specifier": `"${reference.specifier}"`,
-        "specifier trace": reference.trace.message,
-        ...detailsFromPluginController(pluginController),
-      }),
+      createDetailedMessage$1(
+        `Failed to resolve url reference
+${reference.trace.message}
+${reason}`,
+        {
+          ...detailsFromFirstReference(reference),
+          ...details,
+          ...detailsFromPluginController(pluginController),
+        },
+      ),
     );
     resolveError.name = "RESOLVE_URL_ERROR";
     resolveError.code = code;
@@ -13727,14 +13744,18 @@ const createFetchUrlContentError = ({
     reason,
     ...details
   }) => {
+    const reference = urlInfo.firstReference;
     const fetchError = new Error(
-      createDetailedMessage$1(`Failed to fetch url content`, {
-        reason,
-        ...details,
-        "url": urlInfo.url,
-        "url reference trace": urlInfo.firstReference.trace.message,
-        ...detailsFromPluginController(pluginController),
-      }),
+      createDetailedMessage$1(
+        `Failed to fetch url content
+${reference.trace.message}
+${reason}`,
+        {
+          ...detailsFromFirstReference(reference),
+          ...details,
+          ...detailsFromPluginController(pluginController),
+        },
+      ),
     );
     fetchError.name = "FETCH_URL_CONTENT_ERROR";
     fetchError.code = code;
@@ -13743,7 +13764,7 @@ const createFetchUrlContentError = ({
     if (code === "PARSE_ERROR") {
       fetchError.trace = error.trace;
     } else {
-      fetchError.trace = urlInfo.firstReference.trace;
+      fetchError.trace = reference.trace;
     }
     fetchError.asResponse = error.asResponse;
     return fetchError;
@@ -13792,73 +13813,101 @@ const createTransformUrlContentError = ({
   urlInfo,
   error,
 }) => {
+  if (error.code === "MODULE_NOT_FOUND") {
+    return error;
+  }
   if (error.code === "DIRECTORY_REFERENCE_NOT_ALLOWED") {
     return error;
   }
+  if (error.code === "PARSE_ERROR") {
+    const reference = urlInfo.firstReference;
+    let trace = reference.trace;
+    let line = error.line;
+    let column = error.column;
+    if (urlInfo.isInline) {
+      line = trace.line + line;
+      line = line - 1;
+      trace = {
+        ...trace,
+        line,
+        column,
+        codeFrame: generateContentFrame({
+          line,
+          column,
+          content: urlInfo.inlineUrlSite.content,
+        }),
+        message: stringifyUrlSite({
+          url: urlInfo.inlineUrlSite.url,
+          line,
+          column,
+          content: urlInfo.inlineUrlSite.content,
+        }),
+      };
+    } else {
+      trace = {
+        url: urlInfo.url,
+        line,
+        column: error.column,
+        codeFrame: generateContentFrame({
+          line,
+          column: error.column,
+          content: urlInfo.content,
+        }),
+        message: stringifyUrlSite({
+          url: urlInfo.url,
+          line,
+          column: error.column,
+          content: urlInfo.content,
+        }),
+      };
+    }
+    const transformError = new Error(
+      createDetailedMessage$1(
+        `parse error on "${urlInfo.type}"
+${trace.message}
+${error.message}`,
+        {
+          "first reference": `${reference.trace.url}:${reference.trace.line}:${reference.trace.column}`,
+          ...detailsFromFirstReference(reference),
+          ...detailsFromPluginController(pluginController),
+        },
+      ),
+    );
+    transformError.cause = error;
+    transformError.name = "TRANSFORM_URL_CONTENT_ERROR";
+    transformError.code = "PARSE_ERROR";
+    transformError.stack = error.stack;
+    transformError.reason = error.message;
+    transformError.trace = trace;
+    transformError.asResponse = error.asResponse;
+    return transformError;
+  }
   const createFailedToTransformError = ({
     code = error.code || "TRANSFORM_URL_CONTENT_ERROR",
     reason,
     ...details
   }) => {
+    const reference = urlInfo.firstReference;
+    let trace = reference.trace;
     const transformError = new Error(
       createDetailedMessage$1(
-        `"transformUrlContent" error on "${urlInfo.type}"`,
+        `"transformUrlContent" error on "${urlInfo.type}"
+${trace.message}
+${reason}`,
         {
-          reason,
+          ...detailsFromFirstReference(reference),
           ...details,
-          "url": urlInfo.url,
-          "url reference trace": urlInfo.firstReference.trace.message,
           ...detailsFromPluginController(pluginController),
         },
       ),
     );
+    transformError.cause = error;
     transformError.name = "TRANSFORM_URL_CONTENT_ERROR";
     transformError.code = code;
     transformError.reason = reason;
     transformError.stack = error.stack;
     transformError.url = urlInfo.url;
-    transformError.trace = urlInfo.firstReference.trace;
-    if (code === "PARSE_ERROR") {
-      transformError.reason = `parse error on ${urlInfo.type}`;
-      transformError.cause = error;
-      let line = error.line;
-      if (urlInfo.type === "js_module") {
-        line = line - 1;
-      }
-      if (urlInfo.isInline) {
-        transformError.trace.line = urlInfo.firstReference.trace.line + line;
-        transformError.trace.column =
-          urlInfo.firstReference.trace.column + error.column;
-        transformError.trace.codeFrame = generateContentFrame({
-          line: transformError.trace.line,
-          column: transformError.trace.column,
-          content: urlInfo.inlineUrlSite.content,
-        });
-        transformError.trace.message = stringifyUrlSite({
-          url: urlInfo.inlineUrlSite.url,
-          line: transformError.trace.line,
-          column: transformError.trace.column,
-          content: urlInfo.inlineUrlSite.content,
-        });
-      } else {
-        transformError.trace = {
-          url: urlInfo.url,
-          line,
-          column: error.column,
-          codeFrame: generateContentFrame({
-            line,
-            column: error.column,
-            content: urlInfo.content,
-          }),
-          message: stringifyUrlSite({
-            url: urlInfo.url,
-            line,
-            column: error.column,
-            content: urlInfo.content,
-          }),
-        };
-      }
-    }
+    transformError.trace = trace;
     transformError.asResponse = error.asResponse;
     return transformError;
   };
@@ -13870,17 +13919,20 @@ const createTransformUrlContentError = ({
 
 const createFinalizeUrlContentError = ({
   pluginController,
-
   urlInfo,
   error,
 }) => {
+  const reference = urlInfo.firstReference;
   const finalizeError = new Error(
-    createDetailedMessage$1(`"finalizeUrlContent" error on "${urlInfo.type}"`, {
-      ...detailsFromValueThrown(error),
-      "url": urlInfo.url,
-      "url reference trace": urlInfo.firstReference.trace.message,
-      ...detailsFromPluginController(pluginController),
-    }),
+    createDetailedMessage$1(
+      `"finalizeUrlContent" error on "${urlInfo.type}"
+${reference.trace.message}`,
+      {
+        ...detailsFromFirstReference(reference),
+        ...detailsFromValueThrown(error),
+        ...detailsFromPluginController(pluginController),
+      },
+    ),
   );
   if (error && error instanceof Error) {
     finalizeError.cause = error;
@@ -13891,6 +13943,23 @@ const createFinalizeUrlContentError = ({
   return finalizeError;
 };
 
+const detailsFromFirstReference = (reference) => {
+  const referenceInProject = getFirstReferenceInProject(reference);
+  if (referenceInProject === reference) {
+    return {};
+  }
+  return {
+    "first reference in project": `${referenceInProject.trace.url}:${referenceInProject.trace.line}:${referenceInProject.trace.column}`,
+  };
+};
+const getFirstReferenceInProject = (reference) => {
+  const ownerUrlInfo = reference.ownerUrlInfo;
+  if (!ownerUrlInfo.url.includes("/node_modules/")) {
+    return reference;
+  }
+  return getFirstReferenceInProject(ownerUrlInfo.firstReference);
+};
+
 const detailsFromPluginController = (pluginController) => {
   const currentPlugin = pluginController.getCurrentPlugin();
   if (!currentPlugin) {
@@ -13901,6 +13970,18 @@ const detailsFromPluginController = (pluginController) => {
 
 const detailsFromValueThrown = (valueThrownByPlugin) => {
   if (valueThrownByPlugin && valueThrownByPlugin instanceof Error) {
+    if (
+      valueThrownByPlugin.code === "PARSE_ERROR" ||
+      valueThrownByPlugin.code === "MODULE_NOT_FOUND" ||
+      valueThrownByPlugin.name === "RESOLVE_URL_ERROR" ||
+      valueThrownByPlugin.name === "FETCH_URL_CONTENT_ERROR" ||
+      valueThrownByPlugin.name === "TRANSFORM_URL_CONTENT_ERROR" ||
+      valueThrownByPlugin.name === "FINALIZE_URL_CONTENT_ERROR"
+    ) {
+      return {
+        "error message": valueThrownByPlugin.message,
+      };
+    }
     return {
       "error stack": valueThrownByPlugin.stack,
     };
@@ -14520,16 +14601,21 @@ ${ANSI.color(normalizedReturnValue, ANSI.YELLOW)}
           e.code !== "DIRECTORY_REFERENCE_NOT_ALLOWED" &&
           errorOnInlineContentCanSkipThrow(urlInfo)
         ) {
-          const errorInfo =
-            e.code === "PARSE_ERROR" && e.cause
-              ? `${e.cause.reasonCode}\n${e.trace?.message}`
-              : e.stack;
           // When something like <style> or <script> contains syntax error
           // the HTML in itself it still valid
           // keep the syntax error and continue with the HTML
+          if (e.code === "PARSE_ERROR") {
+            logger.error(`parse error on "${urlInfo.type}"
+${e.trace?.message}
+${e.reason}
+--- declared in ---
+${urlInfo.firstReference.trace.message}`);
+            return;
+          }
           logger.error(
-            `Error while cooking ${urlInfo.type} declared in ${urlInfo.firstReference.trace.message}:
-${errorInfo}`,
+            `Error while cooking ${urlInfo.type}
+${urlInfo.firstReference.trace.message}
+${e.stack}`,
           );
           return;
         }
@@ -16101,10 +16187,7 @@ const jsenvPluginHtmlReferenceAnalysis = ({
               type,
               expectedType,
               isOriginalPosition: isOriginal,
-              // we remove 1 to the line because imagine the following html:
-              // <style>body { color: red; }</style>
-              // -> content starts same line as <style> (same for <script>)
-              specifierLine: line - 1,
+              specifierLine: line,
               specifierColumn: column,
               specifier: inlineContentUrl,
               contentType,
@@ -16223,7 +16306,7 @@ const jsenvPluginHtmlReferenceAnalysis = ({
                     },
                   );
                   const importmapReferenceInlined = importmapReference.inline({
-                    line: line - 1,
+                    line,
                     column,
                     isOriginal,
                     specifier: importmapInlineUrl,
@@ -18777,7 +18860,7 @@ const jsenvPluginInliningIntoHtml = () => {
             url: linkReference.url,
           });
           const linkReferenceInlined = linkReference.inline({
-            line: line - 1,
+            line,
             column,
             isOriginal,
             specifier: linkInlineUrl,
@@ -18829,7 +18912,7 @@ const jsenvPluginInliningIntoHtml = () => {
             url: scriptReference.url,
           });
           const scriptReferenceInlined = scriptReference.inline({
-            line: line - 1,
+            line,
             column,
             isOriginal,
             specifier: scriptInlineUrl,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "39.1.3",
+  "version": "39.2.1",
   "description": "Tool to develop, test and build js projects",
   "license": "MIT",
   "author": {
@@ -40,47 +40,47 @@
     "./packages/independent/*",
     "./packages/internal/*",
     "./packages/related/*",
-    "./packages/related/create-jsenv/*"
+    "./packages/related/cli/*"
   ],
   "scripts": {
     "eslint": "npx eslint . --ext=.js,.mjs,.cjs,.html",
-    "dev": "node --conditions=development ./scripts/dev/dev.mjs",
     "test": "node --conditions=development ./scripts/test/test.mjs",
-    "test:workspace": "npm run test --workspaces --if-present -- --workspace",
-    "test:ci": "CI=1 npm run test",
-    "test:workspace:ci": "CI=1 npm run test:workspace",
-    "test:only_dev_server_errors": "node --conditions=development ./tests/dev_server/errors/dev_errors_snapshots.test.mjs",
     "build": "node --conditions=development ./scripts/build/build.mjs",
-    "build:file_size": "node ./scripts/build/build_file_size.mjs --log",
-    "build:workspace": "npm run build --workspaces --if-present --conditions=developement",
-    "monorepo:upgrade_versions": "node ./scripts/monorepo/upgrade_external_versions.mjs",
+    "workspace:test": "npm run test --workspaces --if-present -- --workspace",
+    "workspace:build": "npm run build --workspaces --if-present --conditions=developement",
     "monorepo:sync_packages_versions": "node ./scripts/monorepo/sync_packages_versions.mjs",
     "monorepo:publish": "node ./scripts/monorepo/publish_packages.mjs",
+    "monorepo:upgrade_versions": "node ./scripts/monorepo/upgrade_external_versions.mjs",
     "monorepo:node_modules_clear": "npx @jsenv/snapshot clear **/node_modules/",
+    "build:file_size": "node ./scripts/build/build_file_size.mjs --log",
     "performances": "node --expose-gc ./scripts/performance/generate_performance_report.mjs --log --once",
     "prettier": "prettier --write .",
+    "test:ci": "CI=1 npm run test",
+    "test:only_dev_server_errors": "node --conditions=development ./tests/dev_server/errors/dev_errors_snapshots.test.mjs",
+    "workspace:test:ci": "CI=1 npm run workspace:test",
+    "dev": "node --conditions=development ./scripts/dev/dev.mjs",
     "certificate:install": "node ./scripts/dev/install_certificate_authority.mjs",
     "prepublishOnly": "npm run build"
   },
   "dependencies": {
     "@financial-times/polyfill-useragent-normaliser": "1.10.2",
     "@jsenv/abort": "4.3.0",
-    "@jsenv/ast": "6.2.2",
-    "@jsenv/filesystem": "4.8.0",
+    "@jsenv/ast": "6.2.3",
+    "@jsenv/filesystem": "4.8.1",
     "@jsenv/humanize": "1.2.4",
     "@jsenv/importmap": "1.2.1",
     "@jsenv/integrity": "0.0.2",
-    "@jsenv/js-module-fallback": "1.3.23",
+    "@jsenv/js-module-fallback": "1.3.24",
     "@jsenv/node-esm-resolution": "1.0.2",
-    "@jsenv/plugin-bundling": "2.6.16",
+    "@jsenv/plugin-bundling": "2.6.17",
     "@jsenv/plugin-minification": "1.5.5",
-    "@jsenv/plugin-supervisor": "1.5.2",
-    "@jsenv/plugin-transpilation": "1.4.6",
+    "@jsenv/plugin-supervisor": "1.5.4",
+    "@jsenv/plugin-transpilation": "1.4.7",
     "@jsenv/runtime-compat": "1.3.0",
     "@jsenv/server": "15.2.13",
-    "@jsenv/sourcemap": "1.2.14",
+    "@jsenv/sourcemap": "1.2.15",
     "@jsenv/url-meta": "8.4.2",
-    "@jsenv/urls": "2.2.11",
+    "@jsenv/urls": "2.3.0",
     "@jsenv/utils": "2.1.1"
   },
   "devDependencies": {

package/src/kitchen/errors.js

@@ -13,13 +13,16 @@ export const createResolveUrlError = ({
     ...details
   }) => {
     const resolveError = new Error(
-      createDetailedMessage(`Failed to resolve url reference`, {
-        reason,
-        ...details,
-        "specifier": `"${reference.specifier}"`,
-        "specifier trace": reference.trace.message,
-        ...detailsFromPluginController(pluginController),
-      }),
+      createDetailedMessage(
+        `Failed to resolve url reference
+${reference.trace.message}
+${reason}`,
+        {
+          ...detailsFromFirstReference(reference),
+          ...details,
+          ...detailsFromPluginController(pluginController),
+        },
+      ),
     );
     resolveError.name = "RESOLVE_URL_ERROR";
     resolveError.code = code;
@@ -54,14 +57,18 @@ export const createFetchUrlContentError = ({
     reason,
     ...details
   }) => {
+    const reference = urlInfo.firstReference;
     const fetchError = new Error(
-      createDetailedMessage(`Failed to fetch url content`, {
-        reason,
-        ...details,
-        "url": urlInfo.url,
-        "url reference trace": urlInfo.firstReference.trace.message,
-        ...detailsFromPluginController(pluginController),
-      }),
+      createDetailedMessage(
+        `Failed to fetch url content
+${reference.trace.message}
+${reason}`,
+        {
+          ...detailsFromFirstReference(reference),
+          ...details,
+          ...detailsFromPluginController(pluginController),
+        },
+      ),
     );
     fetchError.name = "FETCH_URL_CONTENT_ERROR";
     fetchError.code = code;
@@ -70,7 +77,7 @@ export const createFetchUrlContentError = ({
     if (code === "PARSE_ERROR") {
       fetchError.trace = error.trace;
     } else {
-      fetchError.trace = urlInfo.firstReference.trace;
+      fetchError.trace = reference.trace;
     }
     fetchError.asResponse = error.asResponse;
     return fetchError;
@@ -119,73 +126,101 @@ export const createTransformUrlContentError = ({
   urlInfo,
   error,
 }) => {
+  if (error.code === "MODULE_NOT_FOUND") {
+    return error;
+  }
   if (error.code === "DIRECTORY_REFERENCE_NOT_ALLOWED") {
     return error;
   }
+  if (error.code === "PARSE_ERROR") {
+    const reference = urlInfo.firstReference;
+    let trace = reference.trace;
+    let line = error.line;
+    let column = error.column;
+    if (urlInfo.isInline) {
+      line = trace.line + line;
+      line = line - 1;
+      trace = {
+        ...trace,
+        line,
+        column,
+        codeFrame: generateContentFrame({
+          line,
+          column,
+          content: urlInfo.inlineUrlSite.content,
+        }),
+        message: stringifyUrlSite({
+          url: urlInfo.inlineUrlSite.url,
+          line,
+          column,
+          content: urlInfo.inlineUrlSite.content,
+        }),
+      };
+    } else {
+      trace = {
+        url: urlInfo.url,
+        line,
+        column: error.column,
+        codeFrame: generateContentFrame({
+          line,
+          column: error.column,
+          content: urlInfo.content,
+        }),
+        message: stringifyUrlSite({
+          url: urlInfo.url,
+          line,
+          column: error.column,
+          content: urlInfo.content,
+        }),
+      };
+    }
+    const transformError = new Error(
+      createDetailedMessage(
+        `parse error on "${urlInfo.type}"
+${trace.message}
+${error.message}`,
+        {
+          "first reference": `${reference.trace.url}:${reference.trace.line}:${reference.trace.column}`,
+          ...detailsFromFirstReference(reference),
+          ...detailsFromPluginController(pluginController),
+        },
+      ),
+    );
+    transformError.cause = error;
+    transformError.name = "TRANSFORM_URL_CONTENT_ERROR";
+    transformError.code = "PARSE_ERROR";
+    transformError.stack = error.stack;
+    transformError.reason = error.message;
+    transformError.trace = trace;
+    transformError.asResponse = error.asResponse;
+    return transformError;
+  }
   const createFailedToTransformError = ({
     code = error.code || "TRANSFORM_URL_CONTENT_ERROR",
     reason,
     ...details
   }) => {
+    const reference = urlInfo.firstReference;
+    let trace = reference.trace;
     const transformError = new Error(
       createDetailedMessage(
-        `"transformUrlContent" error on "${urlInfo.type}"`,
+        `"transformUrlContent" error on "${urlInfo.type}"
+${trace.message}
+${reason}`,
         {
-          reason,
+          ...detailsFromFirstReference(reference),
           ...details,
-          "url": urlInfo.url,
-          "url reference trace": urlInfo.firstReference.trace.message,
           ...detailsFromPluginController(pluginController),
         },
       ),
     );
+    transformError.cause = error;
     transformError.name = "TRANSFORM_URL_CONTENT_ERROR";
     transformError.code = code;
     transformError.reason = reason;
     transformError.stack = error.stack;
     transformError.url = urlInfo.url;
-    transformError.trace = urlInfo.firstReference.trace;
-    if (code === "PARSE_ERROR") {
-      transformError.reason = `parse error on ${urlInfo.type}`;
-      transformError.cause = error;
-      let line = error.line;
-      if (urlInfo.type === "js_module") {
-        line = line - 1;
-      }
-      if (urlInfo.isInline) {
-        transformError.trace.line = urlInfo.firstReference.trace.line + line;
-        transformError.trace.column =
-          urlInfo.firstReference.trace.column + error.column;
-        transformError.trace.codeFrame = generateContentFrame({
-          line: transformError.trace.line,
-          column: transformError.trace.column,
-          content: urlInfo.inlineUrlSite.content,
-        });
-        transformError.trace.message = stringifyUrlSite({
-          url: urlInfo.inlineUrlSite.url,
-          line: transformError.trace.line,
-          column: transformError.trace.column,
-          content: urlInfo.inlineUrlSite.content,
-        });
-      } else {
-        transformError.trace = {
-          url: urlInfo.url,
-          line,
-          column: error.column,
-          codeFrame: generateContentFrame({
-            line,
-            column: error.column,
-            content: urlInfo.content,
-          }),
-          message: stringifyUrlSite({
-            url: urlInfo.url,
-            line,
-            column: error.column,
-            content: urlInfo.content,
-          }),
-        };
-      }
-    }
+    transformError.trace = trace;
     transformError.asResponse = error.asResponse;
     return transformError;
   };
@@ -197,17 +232,20 @@ export const createTransformUrlContentError = ({
 
 export const createFinalizeUrlContentError = ({
   pluginController,
-
   urlInfo,
   error,
 }) => {
+  const reference = urlInfo.firstReference;
   const finalizeError = new Error(
-    createDetailedMessage(`"finalizeUrlContent" error on "${urlInfo.type}"`, {
-      ...detailsFromValueThrown(error),
-      "url": urlInfo.url,
-      "url reference trace": urlInfo.firstReference.trace.message,
-      ...detailsFromPluginController(pluginController),
-    }),
+    createDetailedMessage(
+      `"finalizeUrlContent" error on "${urlInfo.type}"
+${reference.trace.message}`,
+      {
+        ...detailsFromFirstReference(reference),
+        ...detailsFromValueThrown(error),
+        ...detailsFromPluginController(pluginController),
+      },
+    ),
   );
   if (error && error instanceof Error) {
     finalizeError.cause = error;
@@ -218,6 +256,23 @@ export const createFinalizeUrlContentError = ({
   return finalizeError;
 };
 
+const detailsFromFirstReference = (reference) => {
+  const referenceInProject = getFirstReferenceInProject(reference);
+  if (referenceInProject === reference) {
+    return {};
+  }
+  return {
+    "first reference in project": `${referenceInProject.trace.url}:${referenceInProject.trace.line}:${referenceInProject.trace.column}`,
+  };
+};
+const getFirstReferenceInProject = (reference) => {
+  const ownerUrlInfo = reference.ownerUrlInfo;
+  if (!ownerUrlInfo.url.includes("/node_modules/")) {
+    return reference;
+  }
+  return getFirstReferenceInProject(ownerUrlInfo.firstReference);
+};
+
 const detailsFromPluginController = (pluginController) => {
   const currentPlugin = pluginController.getCurrentPlugin();
   if (!currentPlugin) {
@@ -228,6 +283,18 @@ const detailsFromPluginController = (pluginController) => {
 
 const detailsFromValueThrown = (valueThrownByPlugin) => {
   if (valueThrownByPlugin && valueThrownByPlugin instanceof Error) {
+    if (
+      valueThrownByPlugin.code === "PARSE_ERROR" ||
+      valueThrownByPlugin.code === "MODULE_NOT_FOUND" ||
+      valueThrownByPlugin.name === "RESOLVE_URL_ERROR" ||
+      valueThrownByPlugin.name === "FETCH_URL_CONTENT_ERROR" ||
+      valueThrownByPlugin.name === "TRANSFORM_URL_CONTENT_ERROR" ||
+      valueThrownByPlugin.name === "FINALIZE_URL_CONTENT_ERROR"
+    ) {
+      return {
+        "error message": valueThrownByPlugin.message,
+      };
+    }
     return {
       "error stack": valueThrownByPlugin.stack,
     };

package/src/kitchen/kitchen.js

@@ -487,16 +487,21 @@ ${ANSI.color(normalizedReturnValue, ANSI.YELLOW)}
           e.code !== "DIRECTORY_REFERENCE_NOT_ALLOWED" &&
           errorOnInlineContentCanSkipThrow(urlInfo)
         ) {
-          const errorInfo =
-            e.code === "PARSE_ERROR" && e.cause
-              ? `${e.cause.reasonCode}\n${e.trace?.message}`
-              : e.stack;
           // When something like <style> or <script> contains syntax error
           // the HTML in itself it still valid
           // keep the syntax error and continue with the HTML
+          if (e.code === "PARSE_ERROR") {
+            logger.error(`parse error on "${urlInfo.type}"
+${e.trace?.message}
+${e.reason}
+--- declared in ---
+${urlInfo.firstReference.trace.message}`);
+            return;
+          }
           logger.error(
-            `Error while cooking ${urlInfo.type} declared in ${urlInfo.firstReference.trace.message}:
-${errorInfo}`,
+            `Error while cooking ${urlInfo.type}
+${urlInfo.firstReference.trace.message}
+${e.stack}`,
           );
           return;
         }

package/src/kitchen/url_graph/references.js

@@ -64,6 +64,7 @@ export const createDependencies = (ownerUrlInfo) => {
     isOriginalPosition,
     specifierLine,
     specifierColumn,
+    content,
     ...rest
   }) => {
     const parentUrl = isOriginalPosition
@@ -84,6 +85,7 @@ export const createDependencies = (ownerUrlInfo) => {
       specifierLine,
       specifierColumn,
       isInline: true,
+      content,
       ...rest,
     });
     return reference;
@@ -411,6 +413,12 @@ const createReference = ({
     ownerUrlInfo = reference.ownerUrlInfo,
     ...props
   }) => {
+    const content =
+      ownerUrlInfo === undefined
+        ? isOriginalPosition
+          ? reference.ownerUrlInfo.originalContent
+          : reference.ownerUrlInfo.content
+        : ownerUrlInfo.content;
     const trace = traceFromUrlSite({
       url:
         ownerUrlInfo === undefined
@@ -418,12 +426,7 @@ const createReference = ({
             ? reference.ownerUrlInfo.url
             : reference.ownerUrlInfo.generatedUrl
           : reference.ownerUrlInfo.url,
-      content:
-        ownerUrlInfo === undefined
-          ? isOriginalPosition
-            ? reference.ownerUrlInfo.originalContent
-            : reference.ownerUrlInfo.content
-          : ownerUrlInfo.content,
+      content,
       line,
       column,
     });
@@ -620,14 +623,15 @@ const applyDependencyRemovalEffects = (reference) => {
 };
 
 const traceFromUrlSite = (urlSite) => {
+  const codeFrame = urlSite.content
+    ? generateContentFrame({
+        content: urlSite.content,
+        line: urlSite.line,
+        column: urlSite.column,
+      })
+    : "";
   return {
-    codeFrame: urlSite.content
-      ? generateContentFrame({
-          content: urlSite.content,
-          line: urlSite.line,
-          column: urlSite.column,
-        })
-      : "",
+    codeFrame,
     message: stringifyUrlSite(urlSite),
     url: urlSite.url,
     line: urlSite.line,
@@ -637,7 +641,7 @@ const traceFromUrlSite = (urlSite) => {
 
 const adjustUrlSite = (urlInfo, { url, line, column }) => {
   const isOriginal = url === urlInfo.url;
-  const adjust = (urlSite, urlInfo) => {
+  const adjust = (urlInfo, urlSite) => {
     if (!urlSite.isOriginal) {
       return urlSite;
     }
@@ -646,33 +650,35 @@ const adjustUrlSite = (urlInfo, { url, line, column }) => {
       return urlSite;
     }
     const parentUrlInfo = urlInfo.graph.getUrlInfo(inlineUrlSite.url);
-    return adjust(
-      {
-        isOriginal: true,
-        url: inlineUrlSite.url,
-        content: inlineUrlSite.content,
-        line:
-          inlineUrlSite.line === undefined
-            ? urlSite.line
-            : inlineUrlSite.line + urlSite.line,
-        column:
-          inlineUrlSite.column === undefined
-            ? urlSite.column
-            : inlineUrlSite.column + urlSite.column,
-      },
-      parentUrlInfo,
-    );
-  };
-  return adjust(
-    {
-      isOriginal,
-      url,
-      content: isOriginal ? urlInfo.originalContent : urlInfo.content,
+    line =
+      inlineUrlSite.line === undefined
+        ? urlSite.line
+        : inlineUrlSite.line + urlSite.line;
+    // we remove 1 to the line because imagine the following html:
+    // <style>body { color: red; }</style>
+    // -> content starts same line as <style> (same for <script>)
+    if (urlInfo.content[0] === "\n") {
+      line = line - 1;
+    }
+    column =
+      inlineUrlSite.column === undefined
+        ? urlSite.column
+        : inlineUrlSite.column + urlSite.column;
+    return adjust(parentUrlInfo, {
+      isOriginal: true,
+      url: inlineUrlSite.url,
+      content: inlineUrlSite.content,
       line,
       column,
-    },
-    urlInfo,
-  );
+    });
+  };
+  return adjust(urlInfo, {
+    isOriginal,
+    url,
+    content: isOriginal ? urlInfo.originalContent : urlInfo.content,
+    line,
+    column,
+  });
 };
 
 const getRedirectedReferenceProps = (reference, url) => {

package/src/plugins/inlining/jsenv_plugin_inlining_into_html.js

@@ -47,7 +47,7 @@ export const jsenvPluginInliningIntoHtml = () => {
             url: linkReference.url,
           });
           const linkReferenceInlined = linkReference.inline({
-            line: line - 1,
+            line,
             column,
             isOriginal,
             specifier: linkInlineUrl,
@@ -99,7 +99,7 @@ export const jsenvPluginInliningIntoHtml = () => {
             url: scriptReference.url,
           });
           const scriptReferenceInlined = scriptReference.inline({
-            line: line - 1,
+            line,
             column,
             isOriginal,
             specifier: scriptInlineUrl,

package/src/plugins/reference_analysis/html/jsenv_plugin_html_reference_analysis.js

@@ -264,10 +264,7 @@ export const jsenvPluginHtmlReferenceAnalysis = ({
               type,
               expectedType,
               isOriginalPosition: isOriginal,
-              // we remove 1 to the line because imagine the following html:
-              // <style>body { color: red; }</style>
-              // -> content starts same line as <style> (same for <script>)
-              specifierLine: line - 1,
+              specifierLine: line,
               specifierColumn: column,
               specifier: inlineContentUrl,
               contentType,
@@ -386,7 +383,7 @@ export const jsenvPluginHtmlReferenceAnalysis = ({
                     },
                   );
                   const importmapReferenceInlined = importmapReference.inline({
-                    line: line - 1,
+                    line,
                     column,
                     isOriginal,
                     specifier: importmapInlineUrl,