Can't resolve './locale' using react-moment Gatsby - momentjs

Already installed moment and react-moment and imported in my jsx component like below
import React from 'react'
import Moment from 'react-moment'
<Moment format="MMMM D, YYYY">{post.post_date}</Moment>
Got Module not found: Error: Can't resolve './locale'

Rolling back to moment 2.24.0 fixed the issue.
yarn add moment#2.24.0

Related

VisualCode error { expectedcss(css-lcurlyexpected)

Please help me to solve the problem with import fonts into css file in React.js App.
I use typescript and when I import fonts into src/index.css file i received error:
"{ expectedcss(css-lcurlyexpected)"
How can I fix this?
import '#fontsource/roboto/300.css';
import '#fontsource/roboto/400.css';
import '#fontsource/roboto/500.css';
import '#fontsource/roboto/700.css';
I don't know how to fix this

ReScript React how to import CSS files?

I am working on porting an existing React App to ReScript React, however I am running into a few issues. Namely I can't for the life of me figure out how to import CSS in ReScript, for example, In React to import Bootstrap all I would have to do is:
import 'bootstrap/dist/css/bootstrap.min.css';
However there is no corresponding way to do this in ReScript (to my knowledge), I tried doing:
#module("bootstrap/dist/css/bootstrap.min.css")
But it doesn't work. How can I import CSS files in ReScript React?
Use a %%raw expression to import CSS files within your ReScript / React component code:
// in a CommonJS setup
%%raw("require('./styles/main.css')")
// or with ES6
%%raw("import './styles/main.css'")
Reference - https://rescript-lang.org/docs/react/latest/styling

How to use a Buefy navbar with a Vue 3 project?

I made my first Vue project and everything works fine but it's ugly, so now I want to improve it by using Buefy.
I followed the instructions but I can't get it to work, I get the error:
Cannot read property 'use' of undefined
I installed it and wrote this code:
import Vue from 'vue'
import Buefy from 'buefy'
import 'buefy/dist/buefy.css'
Vue.use(Buefy)
What am I missing?
The latest version of Buefy (v0.9.8) supports Vue 2 but does not support Vue 3 .

unable to import scss file as react module

I have a Dashboard.tsx file and Dashboard.scss file (I'm using vscode)
I'm trying to import the scss file like so: Import * as style from './Dashboard.scss'
but it can't find the module,
I tried also import style from './Dashboard.scss'
same error,
even tried renaming to Dashboard.module.scss which eliminated the problem but react code won't compile.
Don't import it as named. simply use import "./Dashboard.scss"; and It should work.

Webpack Encore select2 not working with not a function import error

Using Symfony 4 and Webpack Encore, I can't get Select2 to work.
I'm using select2#4.0.3 and importing it this way in app.js:
import $ from 'jquery';
import 'bootstrap';
import 'select2';
I also tried to use
Encore.autoProvidejQuery()
in webpack.config.js, then taking care of commenting the
import $ from 'jquery';
line in app.js so that jquery is not imported twice.
I tried everything I could find in other answsers like:
import select2 form 'select2';
$(() => {
$('.select2-enable').select2();
});
or
select2($);
Almost all my attempts result in the same error:
TypeError: $(...).select2 is not a function
EDIT:
Working now. Everytime I made a change in app.js (and rebuilt) I used the firefox devtool console to check if it was working but I always got the
not a function
error even though the problem was solved and select2 was working.
Is this because I'm using Webpack that the browser console doesn't recognize the select2() function anymore?
First install it using yarn:
yarn add select2
Then use it with require instead of import:
require('select2')
at your app.js file.
It works the same using require or import.
Babel converts import and export declaration to CommonJS (require) which lets you load modules dynamically.
So, despite of them looking the same, try to always use require.

Resources