Categories
Mastering Development

why red1 classname is showing while is not used?

could you please tell me why red1 classname is showing while it is not used ? I am using this plugin https://www.npmjs.com/package/purgecss to remove unused css . I am following this documentation https://purgecss.com/configuration.html here is my code https://codesandbox.io/s/priceless-mclaren-8tcjl?file=/pages/index.js const xx = await new PurgeCSS().purge({ content: ["**/*", "pages/**/*.{js,jsx,ts,tsx}"], css: [ { raw: ".red1 { color: red […]

Categories
Mastering Development

Jest withTypeScript syntaxerror unexpected token, expected “;”

I’ve been trying to setup jest for use with typescript and I’ve tried a bunch of fixes with no luck. I’m getting the error SyntaxError: Unexpected token, expected ";", I think the config isn’t supporting typescript code: https://i.stack.imgur.com/iGBCa.png If anybody has any suggestions I’d be very grateful! Here’s my package.json: "jest": { "preset": "ts-jest", "testEnvironment": […]

Categories
Mastering Development

IE11 Blank Page with React, Typescript, Babel, and Webpack

I have a React application written in Typescript with Babel and Webpack. It loads fine in Firefox and Chrome, but loads a blank page in Internet Explorer 11. I am new to this project with relatively low experience with React/Babel/WebPack/Typescript. I need to make the app work with IE11. I’ve spent a couple days learning […]

Categories
Mastering Development

Vue3 Vite and tests with jest has no template compiler

i use a codebase made with Vue3 Vite, but i cannot find a way to run a simple Jest test importing a component. This works fine in an app create with Vue-cli, but i cannot find a way to make Jest work in a Vue-Vite app with Vue3. Here is the error I encounter FAIL […]

Categories
Mastering Development

Property ‘toBeInTheDocument’ does not exist on type ‘Matchers

Trying to setup testing for a components library. I’ve tried many example and all similar threads on this with no luck. My setupTests.ts file is correctly being loaded (proven with a console.log), and the library seems to be available as if I add import { toBeInTheDocument } from ‘@testing-library/jest-dom/matchers’ and log toBeInTheDocument it is present. […]

Categories
Mastering Development

Cannot manage to get Jest working with reactjs

I’m getting the following errors when trying to run npm run test. npm : FAIL src/App.test.js At line:1 char:1 + npm run test + ~~~~~~~~~~~~ + CategoryInfo : NotSpecified: (FAIL src/App.test.js:String) [], RemoteException + FullyQualifiedErrorId : NativeCommandError ÔùÅ Test suite failed to run Cannot find module ‘react’ from ‘iconBase.js’ However, Jest was able to find: […]

Categories
Mastering Development

Cannot read property ‘fromJSON’ of undefined while testing in Jest

while running jest i get the following error.I dont know why am i getting this error. TypeError: Cannot read property ‘fromJSON’ of undefined at Object. (node_modules/@grpc/proto-loader/node_modules/protobufjs/ext/descriptor/index.js:3:66) at Object. (node_modules/@grpc/proto-loader/build/src/index.js:23:20) Below is the tsconfig.json { “compilerOptions”: { “target”: “esnext”, “module”: “commonjs”, “outDir”: “dist”, “sourceMap”: true, “moduleResolution”: “node”, “declaration”: true, “experimentalDecorators”: true, “allowSyntheticDefaultImports”: true, /* Allow default […]

Categories
Mastering Development

Cannot load .js file in webpack

I want to use a package that I installed with npm install in my React project. But when I import a component from the package like this in index.jsx: import Header from “material-kit-react/src/components/Header/Header”; I am getting the following error message in the webpack builder: ERROR in ./node_modules/material-kit-react/src/components/Header/Header.js 63:25 Module parse failed: Unexpected token (63:25) You […]

Categories
Mastering Development

TypeScript metadata reflection references other classes before they are defined

I have some TypeORM entities in my codebase which have relations to each other, making a circular dependency. Since decorator metadata is used on each entity class, TypeScript inserts code after each class defining metadata on it. Say that the classes are Business and Qualification. On the relating fields TypeScript will emit code that looks […]

Categories
Mastering Development

Error: Cannot find module ‘ejs’, webpack does not compile the ejs module in the bundle.js file made through webpack.server.js

I keep getting the not found module for ejs and tried bunch of solutions. I am not sure why the ejs module does not compile to the file webpack builds. this is the error: Error: Failed to lookup view “pages/index” in views directory “/views” at Function.y.render (/Users/”user name”/projects/project-node-test/build/bundle.js:277:4330) package.json: “name”: “project-node”, “version”: “1.0.0”, “description”: “”, […]