slbls

slbls

Software engineer from Connecticut.

Member Since 7 years ago

@allstarss ,

Experience Points
8
follower
Lessons Completed
7
follow
Lessons Completed
271
stars
Best Reply Awards
7
repos

3903 contributions in the last year

Pinned
⚡ My personal website.
⚡ UHSSE.org rebrand and redesign.
⚡ 🦈 Bare-bones Snapfish photo downloader.
⚡ “ ” messages in Discord
⚡ ⌨💨 Simple, minimal typing practice
⚡ A neverending stream of bongocat media
Activity
Dec
6
1 day ago
started
started time in 20 hours ago
Dec
5
2 days ago
started
started time in 2 days ago
Dec
3
4 days ago
started
started time in 3 days ago
started
started time in 3 days ago
started
started time in 3 days ago
started
started time in 3 days ago
Dec
2
5 days ago
started
started time in 4 days ago
started
started time in 5 days ago
Nov
30
1 week ago
started
started time in 6 days ago
Nov
25
1 week ago
Nov
24
1 week ago
started
started time in 1 week ago
Nov
23
2 weeks ago
started
started time in 1 week ago
started
started time in 1 week ago
Nov
21
2 weeks ago
started
started time in 2 weeks ago
Nov
20
2 weeks ago
started
started time in 2 weeks ago
Nov
19
2 weeks ago
started
started time in 2 weeks ago
started
started time in 2 weeks ago
Activity icon
issue

slbls issue comment facebook/react

slbls
slbls

Edge 18 & IE 11 server mismatch with SVG icons

Do you want to request a feature or report a bug?

bug

What is the current behavior?

React raises a warning:

Capture d’écran 2019-03-22 à 00 40 00

https://codesandbox.io/s/k91nr3xzy5

import React from "react";

export default () => (
  <div>
    2
    <svg>
      <path d="M0 0h24v24H0z" />
    </svg>
  </div>
);

What is the expected behavior?

No warning

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

React: 16.8.4 Browser: Edge 18

slbls
slbls

Are there any updates regarding this? Does anyone have any workarounds for the time being? I've resorted to rendering inline SVG elements on the client only, but it seems less than ideal.

Activity icon
issue

slbls issue comment react-hook-form/react-hook-form

slbls
slbls

issue: react hook form breaks blitz.js build since 7.20

Version Number

7.20.1

Codesandbox/Expo snack

https://github.com/JohannesKlauss/blitzjs-rhf-build-error

Steps to reproduce

  1. Check out the repo mentioned above
  2. Run yarn install
  3. Run yarn run build
  4. See error

Expected behaviour

The build completes without error.

I guess this is related to this commit: https://github.com/react-hook-form/react-hook-form/commit/461c7db172f34e28c2439f64b23dfd173191a58d

Not quite sure though. I can confirm that is worked without a problem for version 7.19.5. Let me know if you need any help!

What browsers are you seeing the problem on?

No response

Relevant log output

(node:6594) UnhandledPromiseRejectionWarning: Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/dist/index.cjs.js
require() of ES modules is not supported.
require() of /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/dist/index.cjs.js from /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/@hookform/resolvers/zod/dist/zod.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.cjs.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/package.json.

    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1080:13)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (/Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/@hookform/resolvers/zod/dist/zod.js:1:7)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:6594) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:6594) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:6594) UnhandledPromiseRejectionWarning: Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/dist/index.cjs.js
require() of ES modules is not supported.
require() of /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/dist/index.cjs.js from /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/@hookform/resolvers/zod/dist/zod.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.cjs.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/package.json.

    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1080:13)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (/Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/@hookform/resolvers/zod/dist/zod.js:1:7)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
(node:6594) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 2)

> Build error occurred
Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/dist/index.cjs.js
require() of ES modules is not supported.
require() of /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/dist/index.cjs.js from /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/@hookform/resolvers/zod/dist/zod.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.cjs.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/react-hook-form/package.json.

    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1080:13)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (/Users/johannesklauss/Documents/Github/_experimentation/blitzjs-rhf-build-error/node_modules/@hookform/resolvers/zod/dist/zod.js:1:7)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14) {
  type: 'NodeError',
  code: 'ERR_REQUIRE_ESM'
}
error Command failed with exit code 1.


### Code of Conduct

- [X] I agree to follow this project's Code of Conduct
slbls
slbls

This occurs when using Next.js as well.

Nov
8
4 weeks ago
started
started time in 4 weeks ago
started
started time in 4 weeks ago
push

slbls push slbls/mantine

slbls
slbls

[gallery] ArticleCard: Migrate to new version 3 features

slbls
slbls

[gallery] AuthenticationForm: Migrate to new version 3 features

slbls
slbls

[gallery] CheckboxCard: Migrate to new version 3 features

slbls
slbls

[gallery] ContactIcons: Migrate to new version 3 features

slbls
slbls

[gallery] GetInTouch: Migrate to new version 3 features

slbls
slbls

[gallery] Update remaining components to use new version 3 features

slbls
slbls

[@mantine/core] Button: Fix incorrect sx override

slbls
slbls

[gallery] InlineForm: Design rewamp wip

slbls
slbls

[@mantine/core] Tab: Add new pills variant style

slbls
slbls

[gallery] Remove InlineForm and HeroForm

slbls
slbls

[docs] Update tabs styles on home page

slbls
slbls

[gallery] FaqWithBg: Update background to be more neutral

slbls
slbls

[gallery] FaqWithImage: Add better content demo

slbls
slbls

[gallery] Fix missing exports

slbls
slbls

[gallery] Add greycliff font

slbls
slbls

[gallery] Add header to layout

slbls
slbls

[gallery] Fix incorrect home page alignment and add header items

slbls
slbls

[gallery] Fix component page not responding to color scheme changes

slbls
slbls

[gallery] Fix incorrect url generation for dependencies

slbls
slbls

[gallery] Move getDependencyInfo function to separate function

commit sha: 554469e37dde79992f7cb0c8a4804c64c35b1caf

push time in 4 weeks ago
pull request

slbls pull request mantinedev/mantine

slbls
slbls

[@mantine/core] Col: Add breakpoint offsets

As discussed over Discord, this PR adds offset props for every breakpoint to the Col component.

push

slbls push slbls/mantine

slbls
slbls

[@mantine/core] Col: Add breakpoint offsets

commit sha: 96808ad199801f1f48195c2ec12327761c6b5f7c

push time in 4 weeks ago
Activity icon
fork

slbls forked mantinedev/mantine

⚡ React components and hooks library with native dark theme support focused on usability, accessibility and developer experience
slbls MIT License Updated
fork time in 4 weeks ago
Nov
5
1 month ago
started
started time in 1 month ago
Nov
4
1 month ago
started
started time in 1 month ago
Nov
2
1 month ago
pull request

slbls pull request tpatel1781/tpatel1781.github.io

slbls
slbls

Refactor CSS/HTML and introduce Webpack

This PR accomplishes a number of items:

  • Refactor CSS to use BEM
    • Consolidate styles into one stylesheet
    • Implement CSS grid in place of arbitrary margins and padding
    • Introduce fluid typography sizing
  • Refactor HTML with a focus on semantics
  • Implement Wepback as a build tool and bundler
    • Process, minify, etc.

Merging this will require migration to a web host other than GitHub Pages, as it does not support deploying from a specific directory (processed files are now output to a dist folder). I suggest considering Netlify as a new host.

started
started time in 1 month ago
Previous