aws "serverless invoke local" fails to run when node_modules are on a parent folder - node-modules

I have a serverless aws app within a context of many other ones. All of the node_modules are shared in a parent folder, and it works fine with deploys and invoke functions, not with invoke local. This is my structure:
main/
- node_modules
- serverless
- app1
- app2
- serverless.yml
serverless.yml file settings:
package:
include:
- ../../node_modules/**
The problem is whenever I try to run sls invoke local I got a error messages due to package not found. So, the workaround is to npm install --save every package that is outside of my path.
If you have found a solution, not a workaround (like mine) please share :).

It was so obvious I wanted to delete my question, but I'll leave the answer here>
just go to the folder that contains your node_modules, you'll find a package.json there, and run npm install --save for the new packages you need.
cd ../../
npm install --save missing_packages
your serverless.yml include should consider it when running local with no issues.
Violá!

Related

Unknown file extension ".ts" cypress.config.ts on CI

When I run npm run cypress:run in my GitLab CI env I get the error:
Your configFile is invalid: //WebApp/cypress.config.ts
It threw an error when required, check the stack trace below:
TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for //WebApp/cypress.config.ts
test:cypress:
image:
name: cypress/included:10.3.1-typescript
entrypoint: ['']
stage: test
script:
- yarn install --frozen-lockfile
- cd WebApp
- npm run cypress:run
rules:
- *branch
If I run npm run cypress:run from the WebApp folder (where cypress.config.ts is in the root) locally I have no issue. Also no issues when I do an npx cypress:run
However, if I run npx cypress run --config-file WebApp/cypress.config.ts from the parent folder locally I do get the error:
Unknown file extension ".ts"
Any ideas why locally Cypress is working but on the CI the config file is incorrect?
This still seems to be an issues today for LTS 10.10.0
Changing the fresh install cypress.config.ts -> cypress.config.js
and use require like so proved successful.
module.exports = require('cypress').defineConfig({ component: {
devServer: {
framework: "create-react-app",
bundler: "webpack",
},
},
});
I updated this github issue with some more information.
This will be because you have typescript installed globally on your machine so it will work ok locally but not in CI.
Essentially typescript has to be in the folder from where the cypress command is run for it to detect typescript properly.
I went with:
script:
- npm install --global serve
- serve ./build --listen 3000 &
- rm package*
- npm install #percy/cypress typescript
- npm install --global #percy/cli
- percy exec --verbose -- cypress run
Just installing the bare minimum to run the e2e tests ./build is an artifact from another run and percy is really great if you have not used it before.
I am late here, i had similar issue. The del package to delete passed videos was the culprit for me. In the CI environment, it requested to install the del package separately, but in my cypress.config.ts, i was directly able to import del package which was served from third party.
I wanted to install the exact del package in my case and that solved the problem. Del package has its limitations, rimraf solved my issue.
https://www.npmjs.com/package/rimraf
It looks like it's about the version. This might be hepful GitHub
I have tried all different ways suggested in the GitHub issue that
user18025789 linked, but nothing helped. Then I tried switching the config file from .ts to cypress.config.js and it started to work (syntax needed to be updated to JavaScript as well). I have no idea why.
I came across this issue because Typescript was not installed in my Cypress container. When ts-node doesn't have access to typescript, it's require behaves like the native "require", which is why you're seeing the error.
I don't know enough about your specific setup to recommend a solution, but for me I was able to run npm i and mount the volume in the cypress container before running the tests. Another option could be to create a new Dockerfile to extend the base Cypress image with typescript included in the build.
If working on a monorepo and mounting only the app/package folder to test into the cypress docker image, not all dependencies are available within this directory.
To fix this mounting, the whole workspace does the job:
cypress:
image: cypress/included:10.11.0
# …
working_dir: /workspace/app
volumes:
- ..:/workspace
I started facing this issue, suddenly, My solution wasrm -rf node_modules package-lock.jsonnpm i I already had the cypress.config.ts file, so cypress test runner picked it up, when I rannpx cypress open

graphql-codegen not running with config file

In my package.json file I've got script entry that runs graphql-codegen but it complains that the --config argument is invalid:
$> yarn gen
yarn run v1.21.1
$ graphql-codegen --config codegen.yml
Error: Unknown argument: config
...
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Since I believe the default file name is codegen.yml anyway, I try to run it with out that argument and nothing gets generated:
$> yarn graphql-codegen
yarn run v1.21.1
$ /home/aaron/projects/my_app/node_modules/.bin/graphql-codegen
Done in 0.17s.
Any ideas?
for me this solved the issue
Yarn
yarn add -D #graphql-codegen/cli
npm
npm i -D #graphql-codegen/cli
installation guide doc
Ok, I'm not sure exactly what I did to fix this. I believe that I had also installed graphql-codegen globally and tried to uninstall it with sudo npm uninstall graphql-codegen which removed a bunch of packages but the executable still exists:
$>which graphql-codegen
/usr/bin/graphql-codegen
However I decided to run yarn graphql-codegen init on a whim to see if init was valid and because I couldn't remember if I hadn't tried that already. I got the set up questions like normal so I ctrl+C'ed and just ran yarn graphql-codegen and it worked! Then I ran yarn graphql-codegen --watch to test that it took options and that also worked.
If anyone gets this issue, I hope these tips help you.
Try it: rm -rf ./node_modules && npm install
rm http://manpages.ubuntu.com/manpages/trusty/man1/rm.1.html
remove files or directories
-f, --force ignore nonexistent files and arguments, never prompt
-r, -R, --recursive remove directories and their contents recursively
node_modules https://docs.npmjs.com/cli/v7/configuring-npm/folders
You can think of the node_modules folder like a cache
for the external modules that your project depends upon. When you npm
install them, they are downloaded from the web and copied into the
node_modules folder and nodejs is trained to look for them there when
you import them (without a specific path).
npm install https://docs.npmjs.com/cli/install/
This command installs a package and any packages that it depends on.
If the package has a package-lock, or an npm shrinkwrap file, or a
yarn lock file, the installation of dependencies will be driven by
that, respecting the following order of precedence:
npm-shrinkwrap.json
package-lock.json
yarn.lock
Might also be that you have apollo's graphql-codegen package installed, which also exposes a binary called graphql-codegen, which accepts args schema and output, but not config.
For me the solution was to install #graphql-codegen/cli.
graphql.config.yml
schema: http://localhost:8081/graphql
extensions:
codegen:
generates:
./schema.graphql:
- schema-ast
package.json
{
"codegen": "graphql codegen --config graphql.config.yml"
}
I've fixed the problem by using graphql-code-generator instead:
"scripts": {
"graphql:generate": "graphql-code-generator"
}

ESLint couldn't find the plugin "eslint-plugin-react"

I work in sublime-text 3 with the following project structure:
workdir
--root-project-dirictory
---- src
---- eslint.yml
--project.sublime-project
The problem is this: ESLint is looking for the eslint-plugin-react plugin in workdir and not in the root-project-dirictory.
As a result I get an error:
ESLint couldn't find the plugin "eslint-plugin-react".
(The package "eslint-plugin-react" was not found when loaded as a Node module from the directory "/.../workdir".)
...
The plugin "eslint-plugin-react" was referenced from the config file in "root-project-dirictory / .eslintrc.yml".
The problem is this: ESLint is looking for the eslint-plugin-react plugin in workdir and not in the root-project-dirictory.
If eslint-plugin-react is included in the root working directory then it should be installed in the root and you can then extend the sub config from the root.
Until now, I have not found a solution to this problem without changing the structure of the working directory.
As a solution, I use the following:
create an empty sublime-text project
add one by one folder to the project, such as "src", "app" ...
if files are needed in --root-project-dirictory, then add it, but I'm working on the application in separate sublime-text folders of the project
I faced the same issue and found the main reason and how to fix:
npx eslint . --fix
Oops! Something went wrong! :(
ESLint: 6.1.0.
ESLint couldn't find the plugin "eslint-plugin-import".
or this error
Error: Cannot find module 'eslint-config-airbnb'
To fix it run this:
$ rm -rf node_modules
$ npm install eslint --save
$ npm install eslint-config-airbnb-base --save
$ npm install eslint-plugin-markdown --save
$ npm install eslint-plugin-import --save
(install all other plugins)
$ npm i
$ npx eslint --version
(should be less than 7)
Now, it works:
npx eslint . --fix
Reason:
It seems if libs listed under dev reps, ESLint got updated automatically to 7.0 which is not ready yet. As you can see we had the same error before on version 6.
For me, the issue was that I was using eslint globally which does not have that plugin. I used the command npx eslint ... then it worked normally.
In my case I did find a .eslintrc.json file in the Project Parent folder. After deleting it everything went back to normal.

How do I install vuetify directly from github?

When I try with
npm install vuetifyjs/vuetify#v1.5.2
I get "Cannot find package".
UPDATE:
There is a packages folder under which there is a vuetify directory.
I tried npm installing that folder. Everything appeared to go well until I started the dev server.
Now in the console log I see:
[Vuetify] Multiple instances of Vue detected
Seems to be related to https://github.com/vuetifyjs/vuetify/issues/4068 but I cannot tell what the solution is at this point.
I had the same issue to use my own version of Vuetify, waiting for my pull request being accepted.
Here what I did:
I build the vuetify project with my fix.
yarn
yarn build
Then I took the content of 'packages/vuetify' and put it in a new git repository. I remove the .gitignore to be able to commit built files (/es5, /lib, /lib-temp, /dist)
Finally I add this git repository to my project to replace my vuetify version:
npm install git+https://gitlab.com/GITLABUSERNAME/REPOSITORYNAME.git
Looking at the package.json file, the package doesn't have a name property, which it would need to have for you to be able to install it from GitHub.
So the short answer is that you can't install vuetify directly from GitHub via npm.
However, you can install it directly from npm:
npm install vuetify#1.5.2
You can't install vuetify directly from GitHub but you can edit code in 1 component node_modules/vuetify/lib/components/VSlider/VSlider.js Then, you install patch-package and execute path package vuetify Delete node modules and execute yarn to create new node modules Last, yarn serve, you see your code is work
https://www.npmjs.com/package/patch-package

How do I make changes to the v-slider component and test it in my app?

I tried editing inside node_modules but the files are taken from dist and src seems to be ignored.
I tried npm run build to see if I can push my changes to dist but that doesn't work either as other dependencies seem to be missing.
UPDATE:
I followed the instructions about set up dev env in the Contributing section of the docs.
Made the changes and did yarn and yarn build
But the dist folder is identical to the one without my changes
What gives?
Instructions in the set up dev env in the Contributing section work.
After running "yarn build" in the cloned repository folder, you can copy the contents of the dist folder under packages/vuetify to the dist folder under node_modules/vuetify of the app being developed and your changes can be tested.
You can also do npm run build inside packages/vuetify for subsequent changes.
You can edit code in node_modules/vuetify/lib/components/VSlider/VSlider.js
Then, you install patch-package and execute path package vuetify
Delete node modules and execute yarn to create new node modules
Last, yarn serve, you see your code is work
https://www.npmjs.com/package/patch-package

Resources