I am trying build frontend app using npm run build using jenkins.But getting below error. Could you let me know, how to fix below error?
Creating an optimized production build...
Failed to compile.
./node_modules/xlsx/jszip.js 7855:112
Module parse failed: Unexpected token (7855:112)
File was processed with these loaders:
* ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
| * not null.
| */
> function gen_bitlen(s, desc) /* deflate_state *s;*/ /* tree_desc *desc; /* the tree descriptor */*/{
| var tree = desc.dyn_tree;
| var max_code = desc.max_code;
I am using nodejs version v16.18.1 and npm version 8.19.2..
I am using Angular 11 same as you, I think some upgrade packages when installed fail.
I overwrote the new package-lock.json with the old one and my Angular/react app was built and ran successfully again.
I bumped up the xlsx version from 0.17.5 to the latest one 0.18.5. We use angular 14.1.3. This solved the build issue.
But yet to see if that has any side effects on the excel functionality we use in the platform.
After upgrading xlsx version (as #PratikMehta mentioned), if you're dealing with import problems like this in your React project:
Attempted import error: 'xlsx' does not contain a default export (imported as 'XLSX').
Just change the following line
import XLSX from 'xlsx';
to
import * as XLSX from 'xlsx';
Thanks to:
https://onlyabug.com/issue/xlsx-is-not-exported-from-xlsx-2632
Related
Ive only been learning Javascript/Typescript since the start of the year as I decided to create a group of microservices that are all linked together. I have my own API created in nestJS and found that whenever I wanted to call the API from each microservice i was repeating the same code over and over again so I moved it all into its own separate package which I can use.
Every other project I have which uses my npm package does not cause any errors and works fine however these projects are done using babel. I decided to implement my new package into my react frontend project but whenever I import the package and try to use it I get an error
SyntaxError: D:\Projects\Node\Lab Maker\redditbot-frontend\node_modules\labmaker-api-wrapper\lib\utils\BaseAPI.js: Missing class properties transform.
I managed to fix this issue by installing the babel class transform package but then was presented with another error.
Failed to compile.
./node_modules/labmaker-api-wrapper/lib/utils/BaseAPI.js 13:9
Module parse failed: Unexpected token (13:9)
File was processed with these loaders:
* ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|
| class API {
> APIBase;
| APIUrl = 'http://localhost:3000';
|
I'm not sure what is wrong with my package or what causes this error but if anyone is able to take a look at the source code for my npm module and explain how I would fix this issue that would be helpful. https://github.com/LabMaker/API-Wrapper
this is the npm package https://www.npmjs.com/package/labmaker-api-wrapper
I am developing a Visual Studio Code extension (languageserver), and it worked perfectly fine. However, in order to use the latest languageserver features, I updated the vscode-languageclient to the latest version V7.0.0
npm install vscode-languageclient
After removing both node_modules and out folders, and recompiling with
npm install
npm build
npm run compile
I get a TON of compile errors. To show just a few:
node_modules/vscode-languageclient/lib/common/callHierarchy.d.ts:1:75 - error TS2305: Module '"vscode"' has no exported member 'CallHierarchyItem'.
1 import { Disposable, TextDocument, ProviderResult, Position as VPosition, CallHierarchyItem as VCallHierarchyItem [...]
node_modules/vscode-languageclient/lib/common/callHierarchy.d.ts:1:116 - error TS2305: Module '"vscode"' has no exported member 'CallHierarchyIncomingCall'.
1 import { Disposable, TextDocument, ProviderResult, Position as VPosition, CallHierarchyItem as VCallHierarchyItem, CallHierarchyIncomingCall as VCallHierarchyIncomingCall [...]
I am sure that I an missing something important here, but I have no idea what. Btw, the behavior is the same on linux and windows. Maybe somebody had a similar issue or knows what I am doing wrong. Thanks in advance!
As usual, after asking the question I figured it out almost right away.
I did not delete the package-lock.json file. This was the reason for the ton of error messages. It lead to some kind of version mismatch / inconsistency in the code base. So deleting it before executing npm install fixed this issue.
Then, however, the src/extension.ts file with the async function activate() inside showed some errors. The solution here - besides minor follow-ups - is to change
import { LanguageClient, LanguageClientOptions, ...} from 'vscode-languageclient';
to
import { LanguageClient, LanguageClientOptions, ...} from 'vscode-languageclient/node';
Just a follow up answer as this problem seemingly occurs very often: as of version 7.0.0 of the vscode-languageclient package, the codebase was split into "common", "node" and "browser".
split code into common, node and browser to allow using the LSP client and server npm modules in a Web browser via webpack. This is a breaking change and might lead to compile / runtime errors if not adopted. Every module has now three different exports which represent the split into common, node and browser. Lets look at vscode-jsonrpc for an example: (a) the import vscode-jsonrpc will only import the common code, (b) the import vscode-jsonrpc\node will import the common and the node code and (c) the import vscode-jsonrpc\browser will import the common and browser code.
Source: https://github.com/microsoft/vscode-languageserver-node#3160-protocol-600-json-rpc-700-client-and-700-server
Outdated docs are still floating around and it might not be obvious that "npm install vscode-languageclient" will get you the latest version that does not match the old documentation.
I'm working on an open source electron project which I am building using webpack. One requirement for my project is to use the nodegit library which has to be built as a native module.
I've followed what appears to be conventional advice when working with native modules and electron. That is, I run electron-rebuild, have configured the source package to use and finally have configured node-loader to catch the import of any .node files.
Unfortunately, when I go to include the module, I end up with this error:
ERROR in ./node_modules/nodegit/dist/nodegit.js
Module not found: Error: Can't resolve '../build/Debug/nodegit.node' in
'C:\Users\atrauzzi\Development\atrauzzi\gerty\node_modules\nodegit\dist'
# ./node_modules/nodegit/dist/nodegit.js 18:11-49
# ./src/Layer/Domain/Thunktor/Git/CloneGitRepository.ts
# ./src/Layer/Gerty/Component/Repository/AddGitHubRepository.tsx
# ./src/Layer/Gerty/Component/Repository/AddRepository.tsx
# ./src/Layer/Gerty/Component/Workspace.tsx
# ./src/Layer/Gerty/Component/App.tsx
# ./src/Layer/Gerty/GertyServiceProvider.ts
# ./src/Bundle/GertyElectron.ts
The only thing I can see that's suspicious at this point is that when I rebuild the module to work with electron, I only get a Release directory, when the import seems to be looking for Debug:
This could be a red herring however as nodegit is written to try Debug as a fallback after Release has failed.
The general ask here is "How do I get this native module working in my project?".
I also have a corresponding question over at the repo, although on the off chance that my issue is unrelated to the library itself, or that there are some battle-worn veterans of native modules in electron, I figured SO would be a good place to check as well.
Try configuring your webpack by specifying the native module as an external dependancy rather than load it using the node-loader.
https://webpack.js.org/configuration/externals/
How would I import ts-topojson into an Angular2 project so I get Typescript typings? I installed the module using npm and tried to include with a simple import statement but the linter said it couldn't find 'topojson'.
import { Topojson } from 'topojson';
This is my first Angular2 project so I'm very new at this so I could possibly be missing a crucial step.
You could install the package #types/topojson with npm install #types/topojson --save-dev.
Now you can use topojson the following way within a component:
import {topology, feature, ...} from 'topojson';
Or with:
import * as t from '#types/topojson';
Try the following:
Make sure the script is loaded into your scripts in .angular-cli.json.
At the top of a file you want to use the library, add declare let Topojson: any;.
Now you can use Topojson without the TS compiler yelling at you, because it will be implied that it's loaded as a script and made available to you during runtime.
I would like to use moment.js in my node application, so I installed moment.js using node's package manager npm:
npm install moment#2.4.0
Just to be on the safe side, I checked moment is not installed globally and the installed version is really version 2.4.0 (version 2.4.0 in order to use the correct d.ts file ...)
require("moment").version
Alright, seems to be good. I'm also using the latest version of TypeScript (0.9.5).
So, now I added the following file to my projects root directory https://github.com/borisyankov/DefinitelyTyped/blob/master/moment/moment.d.ts and refernced the file:
/// <reference path="moment.d.ts" />
Now, it should work to import moment using TypeScripts import keyword:
import m = require("moment");
Compiling with the following command
tsc app.ts --module commonjs
produces the following errors
/home/unknown/temp/test/app.ts(3,1): error TS2071: Unable to resolve
external module '"moment"'. /home/unknown/temp/test/app.ts(3,1): error
TS2072: Module cannot be aliased to a non-module type.
Why does this error occur? How do I fix it?
The important line in the d.ts file is this one...
declare var moment: MomentStatic;
It just declares a variable for moment.
You can add the following line to resolve your problem:
export = moment;
This should make it loadable using the import statement you have.
If you do this - you won't need yhe reference comment.