Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Production Build Problem: Cannot Find Name: Required #730

Open
dresdor opened this issue Jun 24, 2019 · 3 comments
Open

Production Build Problem: Cannot Find Name: Required #730

dresdor opened this issue Jun 24, 2019 · 3 comments

Comments

@dresdor
Copy link

dresdor commented Jun 24, 2019

Receiving the following dump when running a prod build, but not for a dev build:

    ERROR in ClientApp/app/models/configurationexperience/cx-simulator.ts(14,21): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/shared/services/availability/availability.service.ts(23,20): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/admin/adminfile.component.ts(35,29): error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/admin/admintable.component.ts(43,29): error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/appbar/appbar.component.ts(22,25): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/globalnav/globalnav.component.ts(42,26): error TS2304: Cannot find name 'global'.
    ClientApp/app/components/globalnav/globalnav.component.ts(49,7): error TS2304: Cannot find name 'global'.
    ClientApp/app/components/globalnav/globalnav.component.ts(54,5): error TS2304: Cannot find name 'global'.
    ClientApp/app/components/jobs/jobcollectionform/group/groupfiles.component.ts(10,24): error TS2307: Cannot find module 'stream'.
    ClientApp/app/components/jobs/jobcollectionform/group/groupadditionalinfo.component.ts(42,29): error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/template/templatemanager.component.ts(11,24): error TS2307: Cannot find module 'cluster'.
    ClientApp/app/components/template/templatemanager.component.ts(12,22): error TS2307: Cannot find module 'fs'.
    ClientApp/app/components/template/templatemanager.component.ts(261,31): error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/configurationexperience/output-side/dimension/dimension.component.ts(10,21): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/configurationexperience/inputcomponents/drywetbulbrelative/drywetbulbrelative.component.ts(13,21): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/configurationexperience/inputcomponents/number/number.component.ts(11,21): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/configurationexperience/input-side/temtrol/temtrol.component.ts(11,21): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/app/components/configurationexperience/output-side/weight/weight.component.ts(11,21): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/boot.browser.ts(7,5): error TS2580: Cannot find name 'module'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/boot.browser.ts(8,3): error TS2580: Cannot find name 'module'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/boot.browser.ts(9,3): error TS2580: Cannot find name 'module'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
    ClientApp/boot.server.PRODUCTION.ts(7,32): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.

I have run npm i @types/node, and also some of the other fixes I've found online (such as ensuring tsconfig has "types": ["node"] and "typeRoots": [ "node_modules/@types" ] in it). Nothing is resolving this issue.

This project was started from the angular 5 version of this repo, and this is the last step of updating it to the angular 7 version.

If it matters:
npm -v : 5.6.0
node -v: 8.9.4

tsconfig.json

{
  "compilerOptions": {
    "moduleResolution": "node",
    "module": "es2015",
    "target": "es5",
    "alwaysStrict": true,
    "noImplicitAny": false,
    "sourceMap": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "skipDefaultLibCheck": true,
    "skipLibCheck": true,
    "allowUnreachableCode": false,
    "lib": [
      "es2016",
      "dom"
    ],
    "types": [ "node" ],
    "typeRoots": [ "node_modules/@types" ]
  },
  "include": [
    "ClientApp"
  ]
}

package.json

{
  "name": "Web.Application.Name",
  "version": "1.0.0-rc4",
  "scripts": {
    "clean:install": "npm run clean && rimraf ./node_modules ./bin ./obj ./package-lock.json && dotnet restore Web.Application.Name.csproj && npm i",
    "lint": "tslint -p tsconfig.json",
    "test": "npm run build:vendor && karma start ClientApp/test/karma.conf.js",
    "test:watch": "npm run test -- --auto-watch --no-single-run",
    "test:ci": "npm run test -- --browsers PhantomJS_custom",
    "test:ci:watch": "npm run test:ci -- --auto-watch --no-single-run",
    "test:coverage": "npm run test -- --coverage",
    "build:dev": "npm run build:vendor && npm run build:webpack",
    "build:webpack": "webpack --progress --color",
    "build:prod": "npm run clean && npm run build:vendor -- --env.prod && npm run build:webpack -- --env.prod",
    "build": "npm run build:webpack -- --env.prod",
    "build:vendor": "webpack --config webpack.config.vendor.js --progress --color",
    "clean": "rimraf wwwroot/dist clientapp/dist"
  },
  "dependencies": {
    "@angular/animations": "~7.2.0",
    "@angular/cdk": "7.3.7",
    "@angular/common": "~7.2.0",
    "@angular/compiler": "~7.2.0",
    "@angular/compiler-cli": "~7.2.15",
    "@angular/core": "~7.2.0",
    "@angular/forms": "~7.2.0",
    "@angular/http": "~7.2.0",
    "@angular/material": "^7.3.7",
    "@angular/platform-browser": "~7.2.0",
    "@angular/platform-browser-dynamic": "~7.2.0",
    "@angular/platform-server": "~7.2.0",
    "@angular/router": "~7.2.0",
    "@auth0/angular-jwt": "^2.1.0",
    "@ng-idle/core": "^7.0.0-beta.1",
    "@ngrx/effects": "8.0.1",
    "@ngrx/store": "^8.0.1",
    "@nguniversal/aspnetcore-engine": "^7.1.0",
    "@nguniversal/common": "^7.1.0",
    "@ngx-translate/core": "^11.0.1",
    "@ngx-translate/http-loader": "^4.0.0",
    "angular2-router-loader": "^0.3.5",
    "angular2-template-loader": "^0.6.2",
    "aspnet-prerendering": "^3.0.1",
    "aspnet-webpack": "^3.0.0",
    "awesome-typescript-loader": "^5.2.1",
    "bootstrap": "^4.3.1",
    "convert-units": "^2.3.4",
    "core-js": "^2.6.5",
    "css": "^2.2.4",
    "css-loader": "^2.1.0",
    "error-stack-parser": "^2.0.2",
    "event-source-polyfill": "^1.0.5",
    "expose-loader": "^0.7.5",
    "file-loader": "^3.0.1",
    "file-saver": "^2.0.2",
    "hammerjs": "^2.0.8",
    "html-loader": "^0.5.5",
    "isomorphic-fetch": "^2.2.1",
    "jquery": "^3.3.1",
    "json-loader": "^0.5.7",
    "minimist": "0.0.8",
    "minipass": "^2.3.5",
    "mkdirp": "^0.5.1",
    "moment": "^2.24.0",
    "moment-timezone": "^0.5.25",
    "ng2-pdf-viewer": "^5.3.2",
    "ngx-bootstrap": "^3.2.0",
    "node-sass": "^4.12.0",
    "popper.js": "^1.15.0",
    "preboot": "^7.0.0",
    "raw-loader": "^1.0.0",
    "rimraf": "^2.6.3",
    "rxjs": "6.3.3",
    "safe-buffer": "^5.1.2",
    "sass-loader": "^7.1.0",
    "style-loader": "^0.23.1",
    "to-string-loader": "^1.1.5",
    "typescript": "~3.2.2",
    "url-loader": "^1.1.2",
    "webpack": "^4.29.5",
    "webpack-env": "^0.8.0",
    "webpack-hot-middleware": "^2.24.3",
    "webpack-merge": "^4.2.1",
    "yallist": "^3.0.3",
    "zone.js": "^0.8.29"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.13.3",
    "@angular/cli": "~7.3.3",
    "@angular/compiler-cli": "~7.2.0",
    "@ngtools/webpack": "~7.3.3",
    "@types/jasmine": "~2.8.8",
    "@types/node": "^11.13.15",
    "codelyzer": "~4.5.0",
    "istanbul-instrumenter-loader": "^3.0.1",
    "jasmine-core": "^3.3.0",
    "jasmine-spec-reporter": "^4.2.1",
    "karma": "~4.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage": "~1.1.2",
    "karma-jasmine": "~2.0.1",
    "karma-mocha-reporter": "^2.2.5",
    "karma-phantomjs-launcher": "^1.0.4",
    "karma-remap-coverage": "^0.1.5",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "4.0.2",
    "mini-css-extract-plugin": "^0.5.0",
    "terser-webpack-plugin": "^1.2.3",
    "tslint": "~5.11.0",
    "typescript": "~3.2.2",
    "uglifyjs-webpack-plugin": "^2.1.2",
    "webpack-bundle-analyzer": "^3.0.4",
    "webpack-cli": "^3.3.5"
  }
}

Example usage causing the first error:

  private convert = require('convert-units');

Another error (buffer)

  public downloadFile(): void {
    this.message = "";
    this.downloadInProgress = true;
    let fileNamePrefix = this.dataEndpoint["displayName"].replace("/", "-");
    this.system.getDataManagementFile(this.dataEndpoint["domain"], this.dataEndpoint["fileEndpoint"]).then(
      (res: any) => {
        var byteArray = new Buffer(res, 'base64');   // error on this line
        const data: Blob = new Blob([byteArray], {
          type: EXCEL_TYPE
        });
        FileSaver.saveAs(data, fileNamePrefix + '_' + new Date().getTime() + this.dataEndpoint["fileExtension"]);
        this.downloadInProgress = false;
      }, err => {
        console.log("Unable to download file");
        this.downloadInProgress = false;
        this.message = "Failed to download file";
      });
  }
@RobertThwaite
Copy link

Same issue for me... Any update @dresdor

@dresdor
Copy link
Author

dresdor commented Jul 3, 2019

@RobertThwaite No, unfortunately. I elected to update to angular 6 instead, as that was doable without errors (we were on 5). My current guess is that there's a dependency on a higher version of node or npm (or both) but updating would be a breaking change for our development team, so we need to get some fixes in place before we can attempt it.

@RobertThwaite
Copy link

@dresdor DAMN! exact same boat as you. Was hoping you was the cure! Thanks for initial outlook, I'll give another couple hours then come to same conclusion as you then.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants