Tag: webpack

Webpack, css-minimizer-webpack-plugin vs mini-css-extract-plugin

I am always using mini-css-extract-plugin to optimize CSS. Today I found a new project, css-minimizer-webpack-plugin from here, seems like this project do the same thing as mini-css-extract-plugin. What is the advantage of css-minimizer-webpack-plugin? I read the docs and article from google, seems no one is talking about it? Should I use css-minimizer-webpack-plugin to replace the mini-css-extract-plugin? Answer They are not

Error and blank page on Vue JS when creating a json file in assets

database javascript vue.js web webpack

I went through a very strange issue. I have a vue project created with vue ui. I’m editing my code in visual studio. i want to prototype and work with fake data before connecting my API. So i had the idea to create a json file in my assets folder to host my moock datas and import them to work

When importing a module from node_modules that uses route based lazy loading in create-react-app, should code splitting work in the same way?

code-splitting create-react-app javascript react-lazy-load webpack

I used create-react-app (react ^17.0.2, react-scripts 4.0.3) to knock up a simple application which uses route based lazy loading to perform code splitting. When I build this application I see separate chunks created per lazy loaded component and this all works fine as all my components are exported using default. My output is: I then updated my package.json file to

Can you compress angular image assets on build?

angular imagemin javascript node.js webpack

What I want I have very big images in my assets, which slows down the site by a lot for slower networks. (you can read more about the topic on this lighthouse linked page) I would like to compress them at build time (ng build –prod). For local development, it is irrelevant (ng serve). Optimally I would like to generate

adding nonce to script tag for 3rd party code that breaks ‘unsafe-eval’

content-security-policy javascript nginx webpack

We are using netlify-cms that unfortunately emits code that break CONTENT-SECURITY-POLICY ‘unsafe-eval’. I have tried adding nonce attributes to all the script tags using nginx sub_filter: I then add the nonce to the header also I can see that the nonces in the script tags and the header all match: header But I still get the error message: EvalError: Refused

vue-cli – cannot build for development mode

javascript vue-cli vue.js webpack

I have a .env file in my project package.json When I run npm run build for the first time, it works. When I run it after that, it shows error: When I dig into the logs After I delete the public folder, it suddenly works Answer After I update the outputDir from public to build, it works. vue.config.js

Getting compilation errors regarding loaders when running React app

babeljs javascript node.js reactjs webpack

Hi I’m having an issue when trying to run my react app. I’ve installed a couple of packages to from a tutorial using the ceramic and 3id networks. This error has only shown up recently and I’ve looked online but still not too sure what be causing the issue. The version of node I am using is v14.15.0, my npm

Socket.IO in React app bundled with Vite doesnt work (When bundled with Webpack it does)

javascript reactjs socket.io vite webpack

I have a Create React App that I migrated to Vite. I use socket.io-client. Both versions of the app are exactly the same (simply copy/paste) except the bundlers. This is my websocket connection In the webpack version I can see in the network tab that socket.io is attempting to connect. But in the vite version it doesn’t, it doesn’t even

How do I fix a “nodemon app crashed” error message?

javascript mern node.js reactjs webpack

I have just worked through chapter 2 of the book Full Stack React Projects, Second Edition. When I type into the Terminal yarn development to check my code, I get this error message: I have tried the following solutions: https://stackoverflow.com/a/54450694/14537132 https://stackoverflow.com/a/63298885/14537132 Deleting nodemone.json and re-creating the file Deleting the node modules file & re-installing it How do I fix this?

This dependency was not found: *swiper/vue how to fix?

javascript node.js vue-component vue.js webpack

I’m scratching my head because I ran npm i swiper and read through the Swiper Vue docs and it says to import { Swiper, SwiperSlide } from ‘swiper/vue which I’ve done and I even get the bundle size showing 95.4K (gzipped: 28.9K). When I run npm run serve I then get this error I for the life of me cannot