implimenting react-css-modules and updating file structure
This commit is contained in:
parent
64116b3b7f
commit
2ae82c95ec
@ -8,11 +8,9 @@
|
|||||||
"lint": "eslint .",
|
"lint": "eslint .",
|
||||||
"test": "NODE_ENV=test nyc ava test/*.js --verbose",
|
"test": "NODE_ENV=test nyc ava test/*.js --verbose",
|
||||||
"open": "nyc report --reporter=html & open coverage/index.html",
|
"open": "nyc report --reporter=html & open coverage/index.html",
|
||||||
"coverage": "nyc check-coverage --statements 100 --functions 100 --lines 100 --branches 100",
|
"coverage": "nyc check-coverage --statements 100 --functions 100 --lines 100 --branches 100"
|
||||||
"build-locales": "NODE_ENV=test babel-node scripts/build-locales"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"babel-cli": "^6.16.0",
|
|
||||||
"babel-core": "^6.17.0",
|
"babel-core": "^6.17.0",
|
||||||
"babel-loader": "^6.2.5",
|
"babel-loader": "^6.2.5",
|
||||||
"babel-plugin-add-module-exports": "^0.2.1",
|
"babel-plugin-add-module-exports": "^0.2.1",
|
||||||
@ -21,15 +19,14 @@
|
|||||||
"babel-plugin-transform-object-rest-spread": "^6.16.0",
|
"babel-plugin-transform-object-rest-spread": "^6.16.0",
|
||||||
"babel-preset-react": "^6.16.0",
|
"babel-preset-react": "^6.16.0",
|
||||||
"constant-case": "^2.0.0",
|
"constant-case": "^2.0.0",
|
||||||
|
"css-loader": "^0.25.0",
|
||||||
"fast-async": "^6.1.1",
|
"fast-async": "^6.1.1",
|
||||||
"json-loader": "^0.5.4",
|
"json-loader": "^0.5.4",
|
||||||
"ncp": "^2.0.0",
|
"postcss-loader": "^1.0.0",
|
||||||
"querystring": "^0.2.0",
|
|
||||||
"react": "^15.3.2",
|
"react": "^15.3.2",
|
||||||
|
"react-css-modules": "^3.7.10",
|
||||||
"react-dom": "^15.3.2",
|
"react-dom": "^15.3.2",
|
||||||
"react-hot-loader": "^3.0.0-beta.6",
|
"react-hot-loader": "^3.0.0-beta.6",
|
||||||
"react-intl": "^2.1.5",
|
|
||||||
"react-intl-redux": "^0.1.0",
|
|
||||||
"react-redux": "^4.4.5",
|
"react-redux": "^4.4.5",
|
||||||
"react-router": "^4.0.0-alpha.4",
|
"react-router": "^4.0.0-alpha.4",
|
||||||
"reduce-reducers": "^0.1.2",
|
"reduce-reducers": "^0.1.2",
|
||||||
@ -39,9 +36,8 @@
|
|||||||
"redux-logger": "^2.7.0",
|
"redux-logger": "^2.7.0",
|
||||||
"redux-promise-middleware": "^4.1.0",
|
"redux-promise-middleware": "^4.1.0",
|
||||||
"redux-thunk": "^2.1.0",
|
"redux-thunk": "^2.1.0",
|
||||||
"thenify": "^3.2.1",
|
"style-loader": "^0.13.1",
|
||||||
"webpack": "^2.1.0-beta.25",
|
"webpack": "^2.1.0-beta.25"
|
||||||
"webpack-shell-plugin": "^0.4.3"
|
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"ava": "^0.16.0",
|
"ava": "^0.16.0",
|
||||||
@ -60,8 +56,7 @@
|
|||||||
"nyc": "^8.3.1",
|
"nyc": "^8.3.1",
|
||||||
"pre-commit": "^1.1.3",
|
"pre-commit": "^1.1.3",
|
||||||
"react-addons-test-utils": "^15.3.2",
|
"react-addons-test-utils": "^15.3.2",
|
||||||
"webpack-dev-server": "^1.16.2",
|
"webpack-dev-server": "^1.16.2"
|
||||||
"webpack-shell-plugin": "^0.4.3"
|
|
||||||
},
|
},
|
||||||
"ava": {
|
"ava": {
|
||||||
"failFast": true,
|
"failFast": true,
|
||||||
|
@ -3,8 +3,8 @@ const ReactRedux = require('react-redux');
|
|||||||
const ReactRouter = require('react-router');
|
const ReactRouter = require('react-router');
|
||||||
|
|
||||||
const actions = require('../state/actions');
|
const actions = require('../state/actions');
|
||||||
const Home = require('./home');
|
const Home = require('./home/');
|
||||||
const NotFound = require('./not-found');
|
const NotFound = require('./not-found/');
|
||||||
|
|
||||||
const {
|
const {
|
||||||
updateRouter
|
updateRouter
|
||||||
|
@ -1,16 +0,0 @@
|
|||||||
const React = require('react');
|
|
||||||
const ReactIntl = require('react-intl');
|
|
||||||
|
|
||||||
const {
|
|
||||||
FormattedMessage
|
|
||||||
} = ReactIntl;
|
|
||||||
|
|
||||||
module.exports = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<h1>
|
|
||||||
<FormattedMessage id='greetings' />
|
|
||||||
</h1>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
3
frontend/src/containers/home/home.css
Normal file
3
frontend/src/containers/home/home.css
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
.home {
|
||||||
|
background: red;
|
||||||
|
}
|
13
frontend/src/containers/home/index.js
Normal file
13
frontend/src/containers/home/index.js
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
const React = require('react');
|
||||||
|
const CSSModules = require('react-css-modules');
|
||||||
|
const styles = require('./home.css');
|
||||||
|
|
||||||
|
console.log('STYLES ', styles)
|
||||||
|
|
||||||
|
module.exports = () => {
|
||||||
|
return (
|
||||||
|
<div className={styles.home}>
|
||||||
|
<h1>Home</h1>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
@ -1,6 +1,5 @@
|
|||||||
const pkg = require('../package.json');
|
const pkg = require('../package.json');
|
||||||
const webpack = require('webpack');
|
const webpack = require('webpack');
|
||||||
const WebpackShellPlugin = require('webpack-shell-plugin');
|
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
@ -18,9 +17,6 @@ module.exports = {
|
|||||||
APP_NAME: JSON.stringify(pkg.name),
|
APP_NAME: JSON.stringify(pkg.name),
|
||||||
APP_VERSION: JSON.stringify(pkg.version)
|
APP_VERSION: JSON.stringify(pkg.version)
|
||||||
}
|
}
|
||||||
}),
|
|
||||||
new WebpackShellPlugin({
|
|
||||||
onBuildStart: ['npm run build-locales']
|
|
||||||
})
|
})
|
||||||
],
|
],
|
||||||
module: {
|
module: {
|
||||||
@ -38,6 +34,31 @@ module.exports = {
|
|||||||
path.join(__dirname, '../src')
|
path.join(__dirname, '../src')
|
||||||
],
|
],
|
||||||
loaders: ['json']
|
loaders: ['json']
|
||||||
|
}, {
|
||||||
|
test: /\.css$/,
|
||||||
|
use: [
|
||||||
|
'style-loader',
|
||||||
|
{
|
||||||
|
loader: 'css-loader',
|
||||||
|
options: {
|
||||||
|
modules: true,
|
||||||
|
importLoaders: 1,
|
||||||
|
localIdentName: '[name]__[local]___[hash:base64:5]'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
loader: 'postcss-loader',
|
||||||
|
options: {
|
||||||
|
plugins: function () {
|
||||||
|
return [
|
||||||
|
require('postcss-modules-values'),
|
||||||
|
require('postcss-nested'),
|
||||||
|
require('autoprefixer')
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
}]
|
}]
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user