Skip to content
This repository was archived by the owner on Oct 11, 2022. It is now read-only.

Commit cfbc5dc

Browse files
committed
INitial commit
0 parents  commit cfbc5dc

File tree

8 files changed

+4270
-0
lines changed

8 files changed

+4270
-0
lines changed

.babelrc

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"presets": [["env", {
3+
"targets": {
4+
"node": true
5+
}
6+
}]]
7+
}

.gitignore

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
*.swp
2+
*~
3+
*.iml
4+
.*.haste_cache.*
5+
.DS_Store
6+
.idea
7+
npm-debug.log
8+
node_modules
9+
dist

.npmignore

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
*.swp
2+
*~
3+
*.iml
4+
.*.haste_cache.*
5+
.DS_Store
6+
.idea
7+
.babelrc
8+
.eslintrc
9+
npm-debug.log
10+
lib

LICENSE.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2017 Maximilian Stoiber
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in
13+
all copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21+
THE SOFTWARE.

README.md

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
# `react-app-rewire-styled-components`
2+
3+
Add the [`babel-plugin-styled-components`](https://github.com/styled-components/babel-plugin-styled-components) to your `create-react-app` app via [`react-app-rewired`](https://github.com/timarney/react-app-rewired).
4+
5+
This gives you nicer generated class names that include the components' name, minification of styles and many more goodies 💪
6+
7+
## Installation
8+
9+
```sh
10+
npm install --save react-app-rewire-styled-components
11+
# alternatively if you have yarn installed
12+
yarn add react-app-rewire-styled-components
13+
```
14+
15+
## Usage
16+
17+
In the `config-overrides.js` you created for `react-app-rewired` add this code:
18+
19+
```JS
20+
const rewireStyledComponents = require('react-app-rewire-styled-components');
21+
22+
/* config-overrides.js */
23+
module.exports = function override(config, env) {
24+
config = rewireStyledComponents(config, env);
25+
return config;
26+
}
27+
```
28+
29+
That's it, you're now using the `styled-components` Babel plugin!
30+
31+
## License
32+
33+
Licensed under the MIT License, Copyright ©️ 2017 Maximilian Stoiber. See [LICENSE.md](LICENSE.md) for more information.

package.json

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
{
2+
"name": "react-app-rewire-styled-components",
3+
"version": "1.0.0",
4+
"description": "A plugin to add the styled-components Babel plugin to create-react-app with react-app-rewired",
5+
"repository": {
6+
"type": "git",
7+
"url": "https://github.com/withspectrum/react-app-rewire-styled-components.git"
8+
},
9+
"main": "dist/index.js",
10+
"license": "MIT",
11+
"scripts": {
12+
"precommit": "lint-staged",
13+
"prebuild": "rimraf dist",
14+
"build": "babel src --out-dir dist --ignore '*.test.js'",
15+
"test": "jest src",
16+
"prettier": "prettier --write --single-quote --trailing-comma es5 'src/**/*.js'",
17+
"flow": "flow src"
18+
},
19+
"lint-staged": {
20+
"*.js": [
21+
"prettier --write --single-quote --trailing-comma es5",
22+
"git add"
23+
]
24+
},
25+
"dependencies": {
26+
"babel-plugin-styled-components": "^1.1.4"
27+
},
28+
"peerDependencies": {
29+
"styled-components": "2.x"
30+
},
31+
"devDependencies": {
32+
"babel-cli": "6.x.x",
33+
"babel-preset-env": "^1.4.0",
34+
"babel-preset-flow": "^6.23.0",
35+
"flow-bin": "^0.45.0",
36+
"husky": "^0.13.3",
37+
"jest": "19.x.x",
38+
"lint-staged": "^3.4.1",
39+
"prettier": "^1.3.1",
40+
"rimraf": "^2.6.1"
41+
}
42+
}

src/index.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
const babelLoader = function(conf) {
2+
return conf.loader === 'babel';
3+
};
4+
5+
function rewireStyledComponents(config) {
6+
const babelrc = config.module.loaders.find(babelLoader).query;
7+
babelrc.plugins = ['styled-components'].concat(babelrc.plugins || []);
8+
9+
return config;
10+
}
11+
12+
export default rewireStyledComponents;

0 commit comments

Comments
 (0)