Why is my glob in my npm script not working? - node.js

I am trying to create a regex glob for an NPM script. This is what I have:
"format": "prettier-eslint --write \"{,!(node_modules|cypressTests)/**/}*.{js,json,vue}\""
And this currently formats all .js, .json, and .vue files that are NOT in the node_modules folder or in the cypressTests folder.
The below is my problem:
The cypressTests folder ALSO contains a node_modules folder that I do not want to format. How can I exclude ./cypressTests/node_modules just like I am currently doing for the folder ./node_modules?
I tried like this and this does not work. It then excludes pretty much everything in the entire project for some reason:
"format": "prettier-eslint --write \"{,!(node_modules|cypressTests/node_modules)/**/}*.{js,json,vue}\""

Prettier has an easier solution to ignore files. You can make a .prettierignore file (which uses .gitignore syntax) to ignore files when prettifying. The file should be placed in the root directory of your project. I believe the syntax inside the file in your case would be:
**/node_modules
Which is actually what prettier ignores by default (among some other source-control folder exclusions)-- so unless you already have a .prettierignore file, all node_modules folders should already be excluded from prettification.
The command would then simply be:
"format": "prettier-eslint --write \"**/*.{js,json,vue}\""
or if you want your .prettierignore file to be somewhere else:
"format": "prettier-eslint --ignore-path <path-to-ignore-file> --write \"**/*.{js,json,vue}\""
If this solution doesn't work for you and you need to use the glob method, I wasn't quite able to figure that out, but this website was handy for testing globs.

Related

How to configure prettier to check all files with a specific extension

I have installed prettier via
yarn add prettier
I would like prettier to only format typescript code (I am developing AWS CDK project, there is no src folder by convention & there could be typescript files here and there). In other words, I would like prettier to check all files in my project that has extension *.ts.
I checked its documentation for configuration. But there is no such option to specify file extension.
How can I run prettier for only *ts files then? Is it even possible? If not, what could be the workaround?
To exclude files from formatting, create a .prettierignore file at the root of your project.
And to format only the *.ts files you should ignore everything but the *.ts files.
Example
# Ignore everything recursively
*
# But not the .ts files
!*.ts
# Check subdirectories too
!*/
In the code above, the * means to ignore everything including the subfolders, and the next line !*.ts tells the prettier to reverse the previous ignoring of the .ts files. The last line !*/ means to check the subdirectories too, but with the previous rule, it's only looking for the .ts files.
Check the prettier and gitignore docs for more information.
For *.ts files:
npx prettier 'src/**/*.ts' --write
If you want target other file extensions:
npx prettier 'src/**/*.{js,ts,mjs,cjs,json}' --write

Cypress feature file structure in folders

I am using Cypress with Cucumber preprocessor and currently we have all the feature files in one feature folder, e.g.:
features/testcase1.feature
As we have many files there, we want to have cleaner structure, so we are trying to group some feature files into subfolders:
features/HOME/testcase1.feature, features/HOME/testcase2.feature, features/LOGIN/testcase3.feature
etc.
This is ok, and it is working fine in test runner, as it recognizes the files also in subfolders.
But I have problems to set up the path to all feature files in package.json:
"scripts": {
"test": "node_modules\\.bin\\cypress run --spec \"cypress/integration/features/*.feature\"",
"head": "npm run test -- --headed",
"chrome": "npm run test -- --browser chrome",
},
because this path cypress/integration/features/*.feature will look in the main features folder and not into subfolders.
Is there a way to define a path to check all feature files in subfolders?
something like: cypress/integration/features/(*.)/*.feature
but this solution doesn't work.
ok, the solution was very simpe :)
Just to use 2 asterisks instead of (*.):
cypress/integration/features/**/*.feature

Can I tell babel to replace an output directory?

The Situation
I'm working on a project in Node.js and using babel to transpile my code. My package.json has a build command defined like this:
"scripts": {
"build": "yarn run babel src -d lib",
},
The Problem
This transpiles fine, taking the content of src and outputing the result to lib, but there are two issues:
lib will contain old files from past transpiles even if they no longer have a matching file in src.
Babel will not rename files with a changed case if my OS is case insensitive. For example, if I had transpiled a file named src/Foo.js and later renamed it to src/foo.js then future transpiles will still be named lib/Foo.js
The Question
Can I tell babel to wipe away the contents of the lib directory before transpiling or do I need to just insert a rm into the build script?
Babel does not have functionality to do this. It is very common to use a rimraf or some other means to delete the directory before running Babel. rm directly is certainly also an option, but that does get more complicated if you want to support Windows too, hence the rimraf usage.
Babel CLI has a flag to remove the output directory: --delete-dir-on-start
Couldn't find any online documentation for it, but it's listed in babel --help:
--delete-dir-on-start Delete the out directory before compilation
Was added in this PR back in 2017.

Manually created subfolder from /src is missing in /dist when building

I created a subfolder in /src called /libs. When I run npm run build, the subfolder isn't included in /dist.
I'm assuming that I have to modify a build script? If so, which file would that be?
Edit #1
This all stems from trying to require a custom module located in src/libs from my controller. I've tried various patterns: ../libs/module_name, ./libs/module_name. The only way to have it work was to hard code the path from the root (i.e. /home/me/app/src/libs/module_name).
If I do: console.log(__dirname) in the controller that is attempting to require the module from /lib, I see a reference to /dist. I went looking into /dist and /libs wasn't there.
lb-tsc is a thin wrapper for TypeScript compiler (tsc), you can find the source in loopback-next:packages/build/bin/compile-package.js
Among other options, it provides a new flag --copy-resources to copy non-TypeScript files from src to dist. I think it may work equally well (if not better) as your cp -r solution.
"scripts": {
...
"build": "lb-tsc es2017 --outDir dist --copy-resources"
...
}
Personally, I would use a different solution:
use src only for TypeScript files to be compiled
put JavaScript sources and other files into a different directory, e.g. lib (instead of src/lib).
With the help of a colleague, I figured it out. In package.json, I appended a copy command to bring the libs folder into dist in the build section.
"scripts": {
...
"build": "lb-tsc es2017 --outDir dist && cp -r src/libs dist",
...
}
For those using Nest CLI, please note that it also does not automatically move your "assets" (non-TS files) to the dist folder during the build process.
For these non-TS files you just need to add them to the "compilerOptions": {}
property in the nest-cli.json file.
"compilerOptions": {
"assets": ["**/myfolder/**"]
...
}
The syntax "**/father-folder/**" causes all folders & files in myfolder to be included in the distribution folder (dist)
My resource for this was from Derryl Thomas
Link to NestJS documentation on assets : Link...

Use wildcards in npm run task for tslint so files and subfolders are linted

I am using the npm scripts property / object to validate / lint my TypeScript files in my Angular2 project, you can see my npm run tslint task below:
"scripts": {
"tslint" : "tslint -c tslint.json app/src/**/*.ts -e app/src/**/*.spec.ts",
},
This all seems good as it is linting my actual app files, but not my tests (I will remove this later). However my real problem is that my main.ts file which is in the app/src/ folder and not one of the many subfolders app/src/*sub-folder* is not being included in the linting. How can I improve the wildcard above or tslint command to include typescript files in my app/src folder as well as those in any other subfolder?
If I haven't made myself clear please say so and I'll re-phrase the question.
Many thanks

Resources