dayjs
dayjs copied to clipboard
Errors when updating. Webpack related
I haven't had this error until I updated. What loader do I use with dayjs now?
WARNING in ./node_modules/dayjs/locale/types.d.ts 1:8 Module parse failed: Unexpected token (1:8) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
declare interface ILocale { | name: string | weekdays?: string[] @ ./node_modules/dayjs/locale lazy ^./.*$ namespace object ./types.d.ts
@ ./src/index.js
Any reproduction repo, please?
It happens when using
require('dayjs/locale/' + lang)
That is, with a variable.
Example:
vue create hello-world
cd hello-world/
npm install dayjs --save
npm run serve
then change main.js to
import Vue from 'vue'
import App from './App.vue'
Vue.config.productionTip = false
import day from 'dayjs'
let lang = 'ro'
require('dayjs/locale/' + lang)
console.log(day().format())
new Vue({
render: h => h(App),
}).$mount('#app')
Any update on this? I got this error too when dynamically importing locales.
@munkhorgil Any reproduction repo, please?
@munkhorgil Any reproduction repo, please?
https://github.com/erxes/erxes in widget we use the dayjs
thanks, @munkhorgil, nice project.
However, it is hard for me to debug this issue in this huge repo. Can you please provide an issue reproduction repo containing this issue only, if you have time.
Cheers
thanks, @munkhorgil, nice project.
However, it is hard for me to debug this issue in this huge repo. Can you please provide an issue reproduction repo containing this issue only, if you have time.
Cheers
Thanks, in order to reproduce you don’t need to install the whole project.
- Clone project
- Navigate to widgets folder
- cp .env.sample .env
- yarn install
- yarn dev
@developdeez @mariusa @iamkun I think the key point is require('dayjs/locale/' + lang)
, webpack will try to package all files under locale
folder including .d.ts
files, and the workaround is require('dayjs/locale/' + lang + '.js')
, I tried @mariusa 's reproduction and it worked.
And @munkhorgil , I didn't find dayjs
used in the reproduction project.
Had this issue minutes ago and my current workaround (based on my needs) is to dynamically import each lang, based on the specified locale.
type Locale = 'en-US' | 'fr-FR';
export const importDayJSLang = (locale: Locale) => {
const lang = locale.split('-')[0];
if (locale === 'en-US')
return import(`dayjs/locale/en`).then(() => {
dayjs.locale(lang);
return lang;
});
else if (locale === 'fr-FR')
return import(`dayjs/locale/fr`).then(() => {
dayjs.locale(lang);
return lang;
});
else return Promise.resolve(lang);
};
A refactoring is of course possible, but I pasted it as it to give an idea.
@JounQin
Yup,
import(
dayjs/locale/${locale}.js).then(() => {
solves the problem. Thank you.
@developdeez @mariusa @iamkun I think the key point is
require('dayjs/locale/' + lang)
, webpack will try to package all files underlocale
folder including.d.ts
files, and the workaround isrequire('dayjs/locale/' + lang + '.js')
, I tried @mariusa 's reproduction and it worked.And @munkhorgil , I didn't find
dayjs
used in the reproduction project.
Thanks