I use Stylelint on my project to check styles.
I'm using a plugin that should only run on one folder. And the main configuration that is done for the whole project.
.stylelint file:
{
"extends": "stylelint-config-standard",
"plugins": [
"stylelint-scss",
"stylelint-no-px"
],
"rules": {
...
}
}
and run command: "stylelint": "stylelint \"src/**/*.scss\"".
But i have to use "stylelint-no-px" pluggin only on src/app folder
There was an idea to create two launch commands for different folders(src/app and whole src), but in this case app folder would be checked twice.
Is there any way to create two different configs that could inherit from each other? For example, the first one is called only on src/app folder, and the second without a plugin is called on src/ folder and excludes src/app folder.
You can use the overrides configuration property to modify a Stylelint config for a specified set of files.
For example, to additionally run the stylelint-no-px plugin on the *.scss files in the src/app directory:
{
"extends": "stylelint-config-standard",
"plugins": [
"stylelint-scss",
"stylelint-no-px"
],
"rules": {
... // don't include meowtec/no-px here
},
"overrides": [
{
"files": ["src/app/*.scss", "src/app/**/*.scss"],
"rules": {
"meowtec/no-px": true
}
}
]
}
You can then continue to run Stylelint only once using the following command:
stylelint "src/**/*.scss"
Related
We have a NodeJS app written in typescript. We use modules using relative paths
e.g.
import foo from '#/bar';
We have following paths entry in tsconfig.json
"paths": {
"#/*": [
"./*"
]
}
As typescript does not have path transformation support, we are using ttypescript to compile and override tsconfig.json with tsconfig.build.json
{
"extends": "./tsconfig.json",
"compilerOptions": {
"plugins": [
{
"transform": "#zerollup/ts-transform-paths"
}
]
},
"exclude": ["node_modules/**", "tests/**"]
}
and use yarn to build the code
yarn clean && ttsc --project ./tsconfig.build.json
Now this build the code and converts the relative #module paths to absolute.
Next we are using Serverless framework to build and deploy this code as lambda. Serverless uses tsconfig.json to build the code and effectively ignore the custom path transformation.
Question:
is it possible to solve the above problem without using ttypescript and plugin?
Is it possible to configure serverless to use ttypescript and custom tsconfig
Any other way to solve the problem?
Thanks
I'm running some jest tests with --watch that depend on data fixtures. I want the watch run to trigger when I edit my data files, not just the code.
I've added the following to my package.json specifically adding yaml for moduleFileExtensions but still not having any luck. Based on:
https://jestjs.io/docs/en/configuration#modulefileextensions-arraystring
Is there a setting I could make to the package.json to see if it's even getting picked up at all? I guess next step is to try with a .js config, throw some errors in and see if I'm barking up the wrong tree!
The yaml files are not part of an "import" or otherwise, they are just loaded by my code. So I'm hoping for a way that "touching" the files would re-trigger the watch to run.
Perhaps the watch command needs to also specify what data files to watch?
"jest": {
"verbose": true,
"modulePaths": [
"cdn",
"src"
],
"moduleFileExtensions": [
"js",
"json",
"jsx",
"ts",
"tsx",
"yaml"
]
According to this issue moduleFileExtensions is the right place for configuring additional file extensions to watch. However instead of modulePaths you should use roots to configure directories that you want watched.
Jest definition of modulePaths:
An alternative API to setting the NODE_PATH env variable, modulePaths is an array of absolute paths to additional locations to search when resolving modules.
Modules are resolved before the tests are executed and are not expected to change much. If you're wanting to add directories for Jest to watch then you might consider using the roots config.
Jest definition of roots:
A list of paths to directories that Jest should use to search for files in.
package.json
{
...
"jest": {
"roots": [
"<rootDir>/cdn",
"<rootDir>/src"
],
"moduleFileExtensions": [
"js",
"json",
"jsx",
"ts",
"tsx",
"node",
"yaml",
"yml"
]
}
}
Note that I also added "yml" to moduleFileExtensions just in case you're using yml/yaml.
With a node.js project, I've added eslint-plugin-security and it is giving a lot of warnings for code in my test/spec files (using mochajs). Since the test code won't be running in production, these don't seem as useful as they do in the project's actual code. (A lot of Generic Object Injection Sink warnings )
Is there a way to have the security plugin ignore certain files other than putting /* eslint-disable */ at the top of every spec file?
The best way I found to deal with this case is based on this answer.
You can override parts of your eslint file in a subfolder. In my case I'm disabling problematic rules from a jest plugin inside my e2e tests folder. Example .eslintrc.js in /e2e-tests/ :
module.exports = {
overrides: [
{
files: ["*.spec.js"],
rules: {
"jest/valid-expect": 0
}
}
]
};
There is three way to ignore files or folders:
1. Creating a .eslintignore on your project root folder with the thing you want to ignore:
**/*.js
2. Using eslint cli & the --ignore-path to specify another file where your ignore rules will be located
eslint --ignore-path .jshintignore file.js
3. Using your package.json
{
"name": "mypackage",
"version": "0.0.1",
"eslintConfig": {
"env": {
"browser": true,
"node": true
}
},
"eslintIgnore": ["*.spec.ts", "world.js"]
}
Official Documentation
On my side, I had issue with Intellij IDEA where eslint was checking files in a folder only dedicated to Typescript (+tslint) which was a pain, so I've picked solution 3.
I'm currently migrating a codebase from Babel 6 to 7. The code is made up of multiple individual projects with their own configs.
The main project imports files from external however the scripts being imported from external by main aren't being transpiled and fails on "Unexpected token import". Scripts located directly in main do transpile correctly.
I'm using the following command within the main project to transpile the scripts:
babel-node ./index.js
Another project uses Webpack to do the same thing and handles everything correctly.
This setup also worked fine with Babel 6.
.babelrc for main
{
"ignore": [
"node_modules"
],
"presets": [
["#babel/preset-env", {
"targets": {
"node": "current"
},
"useBuiltIns": "entry"
}]
],
"plugins": [
[
"module-resolver", {
"alias": {
"External": "../external"
}
}
],
"#babel/plugin-proposal-decorators",
"#babel/plugin-proposal-object-rest-spread",
"#babel/plugin-proposal-export-default-from",
"#babel/plugin-proposal-export-namespace-from",
"#babel/plugin-proposal-class-properties"
]}
.babelrc for external
{
"presets": [
"#babel/preset-react"
],
"plugins": [
"#babel/plugin-proposal-class-properties",
"#babel/plugin-proposal-object-rest-spread",
"#babel/plugin-transform-runtime"
]}
I've created an example to detail my problem at:
https://gitlab.com/nerdyman/babel-7-external-import-broken
TL;DR I'm trying to import scripts from outside of a project's root directory but they don't get transpiled by Babel, the scripts from within the project do transpile.
I've managed to fix this by following this comment.
The solution is:
Move .babelrc in the main project to babel.config.js and make it a CommonJS module
Add --ignore=node_modules when running babel-node from the main project
This still seems pretty hacky and Babel doesn't seem to acknowledge the ignore property within babel.config.js it must be specified as a flag.
Babel 7 appears to only allow imports within the directory the babel config is in, however explicitly setting the --ignore flag overrides this.
You can view my working demo and the diff of what I changed to get it working.
The issue is still open on GitHub so there may be a better solution in the future.
current directory's .babelrc won't be loaded while import files in external directory, you may place a .babelrc in that directory and set its presets by relative path(instead of short name):
{ "presets": ["..\pad\node_modules\babel-preset-env"],
"retainLines": true }
For some reason babel doesn't ignore node_modules directory, although I specified it in "ignore" field of .babelrc file. Why does it happen? How to make babel act as expected?
My goal is to compress and mangle all .js files in my ExpressJS app (particularly my all back end code) before I push my app to remote repo and then to server. So I use babel and babili.
Here is my .babelrc config:
{
"presets": [
["latest", {
"modules": false
}]
],
"env": {
"development": {
"presets": ["stage-0", "react", "babili"]
},
"production": {
"presets": ["stage-0", "react", "babili"]
}
},
"ignore": [
"node_modules",
"assets",
"view",
"public",
"test",
"spec",
"logs",
"lib/jasmine_examples",
"db"
]
}
And I run babel from command line like this:
./node_modules/.bin/babel . -d ~/app_compressed/
And babel starts compressing node_modules directory:
node_modules\apache-crypt\gensrc\index.js -> C:\Users\user\app_compressed\node_modules\apache-crypt\gensrc\index.js
node_modules\apache-md5\gensrc\index.js -> C:\Users\user\app_compressed\node_modules\apache-md5\gensrc\index.js
node_modules\babel-preset-env\data\built-in-features.js -> C:\Users\user\app_compressed\node_modules\babel-preset-env\data\built-in-features.js
node_modules\babel-preset-env\data\plugin-features.js -> C:\Users\user\app_compressed\node_modules\babel-preset-env\data\plugin-features.js
node_modules\babel-preset-env\lib\default-includes.js -> C:\Users\user\app_compressed\node_modules\babel-preset-env\lib\default-includes.js
node_modules\babel-preset-env\lib\index.js -> C:\Users\user\app_compressed\node_modules\babel-preset-env\lib\index.js
Literally wrong behavior. How to fix it? How to make babel ignore folders specified in config?
ignore get array of regexes so try like this
ignore: [
/node_modules/,
...,
]
or you can pass a callback function like this
ignore: [
/node_modules/,
function(filepath) {
return filepath !== "/path/to/es6-file.js";
},
]
Babel dev team say that there is a bug and ignored in config file doesn't work now.
However, I found that if you pass ignored directories in command line (with --ignored option), all works well, as expected. You can even pass globs in command line, like **/drafts
./node_modules/.bin/babel . -d ~/app_compressed/ --ignore node_modules,test,assets,stuff,views,public,test,spec,logs,lib/jasmine_examples,db,routes/api/drafts,**/drafts
I had the same problem after moving a Vue project from Cloud9 env to my PC and installing npm dependencies.
Solved this by:
updating the Node.js with nvm for windows
installing the Vue CLI globally and then running build in the Vue UI.
I am not sure what helped though.