Use styles within templates

This commit is contained in:
ColCh 2014-11-02 16:08:48 +03:00
parent 0799d1e65c
commit ab98751f90
4 changed files with 28 additions and 4 deletions

View File

@ -35,7 +35,10 @@
"grunt-open": "~0.2.3",
"jshint-loader": "~0.8.0",
"grunt-contrib-copy": "~0.5.0",
"grunt-contrib-clean": "~0.6.0",
"grunt-contrib-clean": "~0.6.0",<% if (stylesLanguage === 'sass') { %>
"sass-loader": "^0.2.0",<% } %><% if (stylesLanguage === 'less') { %>
"less-loader": "^0.7.7",<% } %><% if (stylesLanguage === 'stylus') { %>
"stylus-loader": "^0.4.0",<% } %>
"react-hot-loader": "^0.4.5"
}
}

View File

@ -41,7 +41,16 @@ module.exports = {
loaders: [{
test: /\.jsx$/,
loader: 'react-hot!jsx-loader?harmony'
}, {
},<% if (stylesLanguage === 'sass') { %> {
test: /\.sass/,
loader: 'style-loader!css-loader!sass-loader?outputStyle=expanded'
},<% } %><% if (stylesLanguage === 'less') { %> {
test: /\.less/,
loader: 'style-loader!css-loader!less-loader'
},<% } %><% if (stylesLanguage === 'stylus') { %> {
test: /\.styl/,
loader: 'style-loader!css-loader!stylus-loader'
},<% } %> {
test: /\.css$/,
loader: 'style-loader!css-loader'
}, {

View File

@ -49,7 +49,16 @@ module.exports = {
}, {
test: /\.css$/,
loader: 'style-loader!css-loader'
}, {
},<% if (stylesLanguage === 'sass') { %> {
test: /\.sass/,
loader: 'style-loader!css-loader!sass-loader?outputStyle=expanded'
},<% } %><% if (stylesLanguage === 'less') { %> {
test: /\.less/,
loader: 'style-loader!css-loader!less-loader'
},<% } %><% if (stylesLanguage === 'stylus') { %> {
test: /\.styl/,
loader: 'style-loader!stylus-loader!less-loader'
},<% } %> {
test: /\.(png|jpg)$/,
loader: 'url-loader?limit=8192'
}]

View File

@ -5,7 +5,10 @@
'use strict';
var React = require('react/addons');
require('../../styles/<%= classedName %>.css');
<% if (stylesLanguage === 'css') { %>require('../../styles/<%= classedName %>.css');<% } %>
<% if (stylesLanguage === 'sass') { %>require('../../styles/<%= classedName %>.sass');<% } %>
<% if (stylesLanguage === 'less') { %>require('../../styles/<%= classedName %>.less');<% } %>
<% if (stylesLanguage === 'stylus') { %>require('../../styles/<%= classedName %>.styl');<% } %>
var <%= classedName %> = React.createClass({
render: function () {