Forum Discussion

Jlibreros's avatar
Jlibreros
Copper Contributor
Feb 19, 2025

Error in the configuration of the SPFx 1.4 project for SharePoint Subscription Edition.

I have created a project for a web part with SPFx version 1.4 for SharePoint Subscription Edition, with the following configuration:

package.json

{

  "name": "wpcf",

  "version": "0.0.1",

  "private": true,

  "main": "lib/index.js",

  "scripts": {

    "preinstall": "npx npm-force-resolutions",

    "build": "gulp bundle",

    "clean": "gulp clean",

    "test": "gulp test"

  },

  "resolutions": {

    "typescript": "3.3.3",

    "@types/react": "16.8.5"

  },

  "dependencies": {

    "@microsoft/sp-core-library": "~1.4.1",

    "@microsoft/sp-lodash-subset": "~1.4.1",

    "@microsoft/sp-webpart-base": "~1.4.1",

    "@pnp/common": "^1.3.11",

    "@pnp/graph": "^1.3.11",

    "@pnp/logging": "^1.3.11",

    "@pnp/odata": "^1.3.11",

    "@pnp/polyfill-ie11": "^2.0.2",

    "@pnp/sp": "^1.3.11",

    "@pnp/spfx-controls-react": "1.20.0",

    "@uifabric/react-hooks": "^7.14.0",

    "core-js": "^3.19.1",

    "lodash": "^4.17.21",

    "luxon": "^2.0.2",

    "office-ui-fabric-react": "^6.214.1",

    "prop-types": "^15.7.2",

    "react": "16.8.5",

    "react-dom": "16.8.5",

    "react-dropzone": "^11.4.2",

    "react-files": "^2.4.9",

    "react-lodash": "^0.1.2"

  },

  "devDependencies": {

    "@microsoft/sp-build-web": "~1.4.1",

    "@microsoft/sp-module-interfaces": "~1.4.1",

    "@microsoft/sp-webpart-workbench": "~1.4.1",

    "@types/core-js": "^2.5.5",

    "@types/lodash": "^4.14.176",

    "@types/luxon": "^2.0.5",

    "@types/react": "16.8.8",

    "@types/react-dom": "16.8.3",

    "@types/webpack-env": "1.13.1",

    "ajv": "~5.2.2",

    "gulp": "^3.9.1",

    "npm-force-resolutions": "0.0.10",

    "tslint-microsoft-contrib": "^6.2.0",

    "typescript": "3.3.3"

  }

}

tsconfig.json

{

  "compilerOptions": {

    "target": "es5",

    "forceConsistentCasingInFileNames": true,

    "module": "esnext",

    "moduleResolution": "node",

    "jsx": "react",

    "declaration": true,

    "sourceMap": true,

    "experimentalDecorators": true,

    "skipLibCheck": true,

    "typeRoots": [

      "./node_modules/@types",

      "./node_modules/@microsoft"

    ],

    "types": [

      "webpack-env"

    ],

    "lib": [

      "es5",

      "dom",

      "es2015.collection",

      "es2015.promise"

    ]

  }

}

gulpfile.js

'use strict';

 

const build = require('@microsoft/sp-build-web');

 

build.addSuppression(`Warning - [sass] The local CSS class 'ms-Grid' is not camelCase and will not be type-safe.`);



// force use of projects specified typescript version

const typeScriptConfig = require('@microsoft/gulp-core-build-typescript/lib/TypeScriptConfiguration');

typeScriptConfig.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));

 

// force use of projects specified react version

build.configureWebpack.mergeConfig({

    additionalConfiguration: (generatedConfiguration) => {

        generatedConfiguration.externals = generatedConfiguration.externals

            .filter(name => !(["react", "react-dom"].includes(name)))

        return generatedConfiguration;

    }

});

build.initialize(require('gulp'));

 

When I build the project . I have get the error 

[22:04:09] ==================[ Finished ]==================
Warning - tslint - src/webparts/cf/components/Cf.tsx(10,1): error no-trailing-whitespace: trailing whitespace
Warning - tslint - src/webparts/cf/components/Cf.tsx(2,1): error no-unused-variable: 'styles' is declared but its
value is never read.
Warning - tslint - src/webparts/cf/components/Cf.tsx(4,1): error no-unused-variable: 'escape' is declared but its

value is never read.
Error - typescript - node_modules/@types/prop-types/index.d.ts(101,38): error TS1005: ',' expected.
Error - typescript - node_modules/@types/prop-types/index.d.ts(101,39): error TS1005: ',' expected.
Error - 'typescript' sub task errored after 4.65 s 
 TypeScript error(s) occurred.
[22:04:09] Project wpcf version: 0.0.1
[22:04:09] Build tools version: 3.2.7
[22:04:09] Node version: v8.17.0
[22:04:09] Total duration: 13 s
[22:04:09] Task warnings: 3
[22:04:09] Task errors: 3


My environment configuration is:

npm list --global --depth=0
C:\Users\Administrator\AppData\Roaming\npm
+-- microsoft/generator-sharepoint@1.10.0
+-- gulp-cli@2.3.0
`-- yo@3.1.1

Can someone help me resolve this issue, please?

No RepliesBe the first to reply

Resources