Comments (7)
I just published v2.3.0 with this change. Let me know if that solves it for you :)
By the way, I don't see how the no-unused-expression
rule prevents you from mutating MyComponent
. Did you mean no-mutation
? If so, you can configure the rule to allow the mutation of anything when setting the propTypes
.
/* eslint fp/no-mutation: ["error", {"exceptions": [{"property": "propTypes"}]}] */
function Component(props) {
// ...
}
Component.propTypes = {
// ...
};
Your way is safer, but I'm mentioning in case you end up finding your current method too confusing for newcomers or hard to read.
By the way, I had not thought of that method, that's a good one to try :)
from eslint-plugin-fp.
Hey thanks! I upgraded and was able to remove my comments disabling the rule.
You're right that no-mutation
is the error I get when trying to assign propTypes
the old-fashioned way. I think I assumed no-unused-expression
because that's the error I've been seeing the most lately as I try to write in a more functional style.
I didn't know about the exceptions
property so thanks for that. I agree that passing an arrow function to Object.assign
looks very funny. Just trying it out for now.
Thanks again for the awesome plugin!
from eslint-plugin-fp.
I can see:
const foo = Object.assign(function foo(ham) { }, { $inject: ['ham'] });
being preferred to:
const foo = function foo(ham) { };
foo.$inject = ['ham'];
from eslint-plugin-fp.
Hi @jdiamond!
From what I see in the Object.assign documentation, the first parameter must be an object. Since functions are objects, this is valid, and I guess I could see some use-cases for it. We could allow (arrow) function expressions, since no variable is mutated.
Did you happen to notice it or do you have a use-case where this rule bothered you?
from eslint-plugin-fp.
Hi @jfmengels,
Thanks for looking into it. I did discover this while working on "real" code so I think it's a valid use-case, but my problem is definitely self-imposed.
I'm working on a React app and am defining modules containing stateless functional components (just functions). Those normally look like this:
const MyComponent = ({ myProp }) => {
return (
<div>{myProp}</div>
);
};
MyComponent.propTypes = {
myProp: React.PropTypes.string,
};
export default MyComponent;
I have the "no-unused-expression" rule turned on which prevents me from mutating MyComponent
with that assignment statement so I changed my code to this:
const propTypes = {
myProp: React.PropTypes.string,
};
// eslint-disable-next-line fp/no-mutating-assign
const MyComponent = Object.assign(({ myProp }) => {
return (
<div>{myProp}</div>
);
}, {
propTypes
});
export default MyComponent;
This works in my app, but now I have to disable the "no-mutating-assign" rule to avoid the lint errors.
from eslint-plugin-fp.
I think this is probably acceptable for function literals as long as they are only accessible after mutation.
from eslint-plugin-fp.
IIRC, @jfmengels did make the change for your first example to work without triggering this error.
from eslint-plugin-fp.
Related Issues (20)
- non-mutating slice reverse HOT 1
- Add more options for `no-unused-expression` rule HOT 1
- no-nil false positive
- merge eslint-plugin-better rule into eslint-plugin-fp HOT 2
- document the difference between no-unused-expressions
- CI build failing on Node 4
- no-nil false positive on switch statements HOT 1
- no-mutating-assign with any expression HOT 3
- (fp/no-nil) rule for callbacks? HOT 5
- Upgrade Lodash to avoid `npm update` security issue HOT 1
- fp/no-unused-expression for Node debug
- proposal: rule for limit arguments in function call
- fp/no-nil
- no-mutation and HTML DOM
- no-mutating-methods allowedObjects doesn't work if chained
- ESLint v6 HOT 4
- Fails when run in Jest via ESLint Node.js API
- Support ESLint 8.x HOT 3
- `fp/no-unused-expression` with `'use strict'` HOT 1
- `fp/no-throw`: Option to ignore inside `try`
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from eslint-plugin-fp.