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

How to propperly build react modular library

I’m trying to create a react components library which is based on Typescript and SASS. The components library will be used in multiple other typescript projects, so type exports are needed as well. Ideally I want to mimic something like "Material-UI"/"React-Bootrap" libraries dist output solutions. Example project structure: |Tabs +–Tabs.tsx +–Tabs.scss +–index.tsx index.tsx index.tsx export […]

Categories
Mastering Development

Styled components: babel-plugin-styled-components not working

I’ve been trying to get the babel-plugin-styled-components plugin to work with my webpack/babelrc configuration but I have not been able to do so. I am using babel-loader and no matter what I try I can’t get the plugin to be recognised. I am using Typescript 4 and Webpack 4. I’ve searched and tried a number […]

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

TypeError: Duplicate declaration, Module build failed Error in Typescript Project

Good Day, I have code something like below In A.ts file: declare class LayerManager { //code constructor(factory: Factory); //code } let self: LayerManager; function LayerManager(factory: Factory) { //code self = this; //code } export default LayerManager; In B.ts file: import LayerManager from ‘../layer-manager/index’; //Code this.layer = new LayerManager(this.factory); //<—In order to have construct Signature I […]

Categories
Mastering Development

TypeScript – error TS5023: Unknown compiler option ‘-r’

I’m working on Windows environment and trying to run a forked node.js + typescript project. This is my package.json : { "name": "my-task", "version": "1.0.0", "private": true, "main": "dist/main.js", "scripts": { "start": "tsc-watch –onSuccess ‘node -r source-map-support/register .’", "test": "jest", "lint": "eslint –cache ‘{src,test}/**/*.ts’" }, "dependencies": { "@types/express": "^4.17.7", "@types/node": "^12.12.53", "express": "^4.17.1", "get-port": "^5.1.1", […]

Categories
Linux Mastering Development

Can’t filter file extensions when the list is in a variable [duplicate]

I guess this is a relative simple question, but I can’t find the way to access the variable content when doing a git diff, so it lists all the files with specific extension. // This works fine git diff –name-only –cached –diff-filter=d *.{sln,csproj,vbproj,vcxprojfilters,proj,projitems,shproj,xml,config,props,targets,nuspec,resx,ruleset,vsixmanifest,vsct,json,json5,webmanifest,yml,yaml,md,htm,html,js,jsm,ts,tsx,css,sass,scss,less,svg,vue,cmd,bat,sh,Makefile,cs,csx,cake,vb,vbx,cs,csx,cake,cs,csx,cake,vb,vb} MyProyect/Service/App/AppGridService.cs // but this does not work // this is the variable […]

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. […]