Categories
Mastering Development

Published npm package does not apply styles

I’m currently working on creating an npm package. Which is basically a React component with added styles using SCSS. When I test it out, the class names are there, but no styles are being applied. Here is the repo for the package. I use a separated webpack config for building the specific folder where the […]

Categories
Development

“Module not found: Error: Can’t resolve ‘electron-is-dev'” in electron & typescript & webpack project

I’m using Electron and Typescript with webpack. And I’m gonna add react.js. But I typed “npx webpack”, I got an error. It says “electron-is-dev module is not found”, but I already installed it. ERROR in ./src/main/window.ts Module not found: Error: Can’t resolve ‘electron-is-dev’ in ‘project-path/src/main’ @ ./src/main/window.ts 2:0-36 12:35-40 @ ./src/main/app.ts I can’t find how […]

Categories
Development

Webpack dev server reloads but doesn’t show Markup or CSS changes?

So i’m pretty new to Webpack, and I finally got the webpack-dev-server running. It recompiles and refreshes page on save, and it shows changes to my JS code. But it doesn’t seem to work well with my SASS or HTML files? On a fresh start, it will show a change if I make it, but […]

Categories
Development

Loading Webpack handlebars images with file-loader

Not sure if I’m approaching this correctly, but I’m trying to use handlebars templates with file-loader in Webpack. The issue I’m having is the assets folder I have with images isn’t being copied over to the dist folder, and the img src is being resolved with file-loader to pull in images. If there is a […]

Categories
Development

React-router component does not update on navigation

As many other people have had the same issue, I’m struggling to interact with a <Link> element to change routes and render a new component. I am able to click on the link and the path for my application changes in my redux store, but no component gets updated. My root component does not seem […]

Categories
Development

“An accessor cannot be declared in an ambient context.” in a custom library

I have a webpack, typescript project (A) which emits a small library. The library is used in an angular 8 project (B). In project A I declare a class like: export class Foo { private foo: string; constructor(foo: string) { this.foo = foo; } } export class Bar extends Foo { private bla: string; constructor(foo: […]

Categories
Development Plugins React

ReactJS Error: Module Build failed: SyntaxError: Unexpected token ‘<'

My ReactJS code throws an error when I try to compile it. I used ReactJS before but I never ran into this error (see below) ERROR in ./kapiche/@kapiche_react/teacher/login.jsx Module build failed (from ./node_modules/babel-loader/lib/index.js): SyntaxError: /mnt/d/src/kapiche/@kapiche_react/teacher/login.jsx: Unexpected token (59.6) 57 | render() { 58 | return ( > 59 | <div> | ^ 60 | Hello […]

Categories
Development Plugins

Got error: Plugin/Preset files are not allowed to export objects, only functions

I got this error while setup my react app using the webpack and babel. I try to change the version of babel but still getting the same error. I’m not getting where’s the problem. ERROR in ./src/index.jsx Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Plugin/Preset files are not allowed to export objects, only functions. In /home/arslan/Downloads/code/node_modules/babel-preset-es2015/lib/index.js […]

Categories
CSS Development

Next.js + Webpack: Struggling to import 3rd party SCSS into project

I am attempting to use this cool React Button Component inside my project but I do not understand where I am going wrong and how my Webpack isn’t working. Please could you help! I am also new at Webpack and I would appreciate it if you could point me in the right direction. Much Thanks […]

Categories
Development

multiple modules not found when deploying app – Ibm cloud

I am trying to deploy my app and it’s always failing onto IBM cloud CI/CD. The issue I have is that there are always some modules not found. The list of modules not found (occurs once every single time when the previous one is being installed) is as follows: depd merge-descriptors finalhandler debug encodeurl escape-html […]