Problem with snowpack using local library - package

There was a similar question (65989811) but more than a year and no satisty answer was given.I have a 'pixi-flex-layout' library locally and I use npm link to use in my projetct. When I start it never works. I put in snowpack config:
packageOptions: {
/* ... */
/*knownEntrypoints: ['pixi-flex-layout/lib/index.js'],
packageLookupFields: ['pixi-flex-layout'],
external: ['pixi-flex-layout']
*/
external: ['pixi-flex-layout'],
packageExportLookupFields:['pixi-flex-layout']
},
when i put that, they starts normaly without any erros(I believe only the 'external' was needed, but, when i go to the page it can't resolve the package:
Uncaught TypeError: Failed to resolve module specifier
"pixi-flex-layout". Relative references must start with
either "/", "./", or "../".
Someone knows how to deal with this? I start to think to change for another application like parcel(even very slow in comparition if it works with local libraries). I can't use from the github, because this library won't work, so I donwload and updtate to work with pixi.js 6.5.5 and rebuild locally.
I help will be appreciated.

Related

Next.js: ./node_modules/next/dist/client/dev/amp-dev.js

I have a very serious issue right now trying to use Next js. No matter what version I use, any time I try to run the npm run dev, I get the following error:
error - ./node_modules/next/dist/client/dev/amp-dev.js
Module not found: Can't resolve 'C:\Usersudbasili\Documents\Programming\Acumen Developers\myportfolio\node_modules\next\dist\compiled\regenerator-runtime\runtime.js' in 'C:\Users\udbasili\Documents\Programming\Acumen Developers\myportfolio\node_modules\next\dist\client\dev'
error - Error: Cannot find module 'C:\Users\udbasili\Documents\Programming\Acumen Developers\myportfolio\.next\fallback-build-manifest.json'Require stack:
This is literally right after running the create next app command, so I don't install any additional package. One thing realized though is that this error doesn't occur when I use the public folder on my window PC but when I use the user folder called udbasili I get the above error. I have been using next.js for a long time and this is the first I am seeing this error
I had the same issue
the problem was that my project files was in a folder beginning with "ud". My folder name was "udemy".
Renaming that folder or moving the project outside that folder solved the issue
If you compare the paths, there is a missing '\' :
C:\Users**\\**udbasili\Documents\Programming\Acumen Developers\...
C:\Usersudbasili\Documents\Programming\Acumen Developers\...
A quick solution that I gave to this issue was to create the project on a different path. For example:
C:\dev\myportfolio
Please head over to https://nextjs.org/docs/messages/swc-disabled
By disabling swc in next.config.js it will resolve your issue.
You can disable swc by adding:
experimental: {
forceSwcTransforms: true,
}
It's possible your autoimport included '/dist/client/dev' in the 'next/amp' path.
Does it work if you import { useAmp } from 'next/amp'?

Expected a string, got object gatsby-plugin-prettier-eslint Gatsby

I am trying to learn Gatsby and I included prettier-eslint plugin with a common configuration. You can see my configuration, the files, etc
When I try to add a css file I get this error:
Have you tried using the following?
eslint: {
patterns: "**/*.{js,jsx,ts,tsx}",
customOptions: {
fix: true,
cache: true,
},
},
The eslint pattern seems to be a string, not an array according to the plugin's example.
This seems to be an unresolved issue of the plugin, according to this opened issue (from a week ago), so keep an eye on that stack trace to see how it evolves. If the dependency has a bug when using the defaults (and suggested) configuration, there's nothing you can do except making a PR if you are able to spot the bug in the source code or wait for the resolution.
I had the same issue. Turns out you must have a prettier config (.prettierrc or similar) set up. Check to make sure you have a config as mentioned in the Prettier docs.

Webpack/React/ Cannot read property 'id' of undefined when module.id

I am getting a bizarre error and I can't find any resolution it.
Fresh react project with a local module linked via package.json link: protocol as followed.
"dependencies": {
"otrm": "link:../otrm",
Everything runs smooth - compilation of the source module works and module dependencies are all installed .
yarn start ends up in this:
Now the error is pretty straight forward:
module.id not defined in my external library. Looking at the debugger the id is really not there.
Now the question begs, how the heck can I add the ID or what did I do wrong? I looked across the forums and Gitlab docs and the most I can find are around Angular apps .. so Stackoverflow you are my last hope.

Why lodash get returns undefined for nested object in the react production build?

Actually, I know my question is s weird but really confused me. lodash functions are awesome and using them is a safe way to have a secure and clean code but in my react project when I use get function of lodash, in the development environment it works well as every developer expected.
import get from 'lodash/get';
const hostname = get(window, 'location.hostname');
// => returns the current hostname
But after I run yarn build && yarn start to make a production build of my ReactJS app and run it, its behavior is changed and returns undefined.
import get from 'lodash/get';
const hostname = get(window, 'location.hostname');
// => returns undefined
So in the production build, I try the get(window, 'location') and it returns the location object. but when I put a key of location the lodash get function returns undefined.
Actually, in the production and just for nested it returns undefined
Due to this issue, I just found this post, but no one answer it.
According to this comment I became passionate about testing my production build. So I listed all thing That happens on the production build of my project that maybe causes this issue.
At first, I doubted to babel plugins that I used for transpile, but none of them affect just on production, they affect for whole environments.
And at last, I find LodashModuleReplacementPlugin. this plugin causes this issue.
Based on its doc:
Deep property path support for methods like _.get, _.has, & _.set.
This plugin omit the deep path support on lodash get. That's the point.

Define is not a function with babel-polyfill and webpack on Azure

I'm having an issue when deploying a React/Redux site to Azure App Service.
It builds and deploys fine, but when visiting the site I get JS errors for babel-polyfill - Uncaught TypeError: define is not a function.
We're using webpack with a few loaders and there is one in particular that I have a feeling could be the problem - imports-loader. We had it set as use: 'imports-loader?define=>false' which I believe overrides the define method. I tried this as true also but with no affect. I tried removing the define=>false altogether and the whole build broke...
See webpack config here.
Advice much welcome!
Cheers
Dave

Resources