sp-dev-docs icon indicating copy to clipboard operation
sp-dev-docs copied to clipboard

Module not found: Error: Can't resolve '@ms/sp-telemetry'

Open vishalshitole opened this issue 1 year ago • 0 comments

What type of issue is this?

Question

What SharePoint development model, framework, SDK or API is this about?

💥 SharePoint Framework

Target SharePoint environment

SharePoint Online

What browser(s) / client(s) have you tested

  • [ ] 💥 Internet Explorer
  • [x] 💥 Microsoft Edge
  • [x] 💥 Google Chrome
  • [ ] 💥 FireFox
  • [ ] 💥 Safari
  • [ ] mobile (iOS/iPadOS)
  • [ ] mobile (Android)
  • [ ] not applicable
  • [ ] other (enter in the "Additional environment details" area below)

Additional environment details

  • SPFx version: 1.19.0
  • Node.js version: 18.20.3

Issue description

I have created a library of reusable code with Rollup, and published it to the private/internal NPM registry. When I try to use that library package in my SPFx solution, I get multiple 'Module not found' error messages while bundling/serving the solution. However, when I add @microsoft/sp-application-base package as a dependency in my SPFx project, it works fine. Please find the attached file with the error message JSON below.

module-not-found-error.json

Below is the rollup.config.js of my reusable code library.

import resolve from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import typescript from "@rollup/plugin-typescript";
import dts from "rollup-plugin-dts";
import terser from "@rollup/plugin-terser";
import peerDepsExternal from "rollup-plugin-peer-deps-external";
import packageJson from './package.json';
import { visualizer } from "rollup-plugin-visualizer";

export default [
  {
    input: "src/index.ts",
    output: [
      {
        file: packageJson.main,
        format: "cjs",
        sourcemap: true,
      },
      {
        file: packageJson.module,
        format: "esm",
        sourcemap: true,
      },
    ],
    plugins: [
      peerDepsExternal(),
      resolve(),
      commonjs(),
      typescript({ tsconfig: "./tsconfig.json" }),
      terser(),
      visualizer(),
    ],
    external: [
      "@microsoft/sp-application-base",
      "@microsoft/sp-core-library",
      "@microsoft/sp-component-base",
      "@microsoft/sp-dynamic-data",
      "@microsoft/sp-http",
      "@microsoft/sp-page-context",
      "@microsoft/sp-webpart-base"
    ],
  },
  {
    input: 'src/index.ts',
    output: [{ file: "dist/types.d.ts", format: "es" }],
    plugins: [dts.default()],
  },
];

Not sure if I am missing anything here. Any inputs/guidance is greatly appreciated.

Thank you!

vishalshitole avatar Oct 14 '24 16:10 vishalshitole