| gitflow | git |
|---|---|
git flow init |
git init |
git commit --allow-empty -m "Initial commit" |
|
git checkout -b develop master |
| // https://hondo.wtf/2015/02/15/enable-cors-in-browsersync | |
| gulp.task('browser-sync', function () { | |
| browserSync({ | |
| notify: false, | |
| port: 6543, | |
| server: { | |
| baseDir: config.dest, | |
| middleware: function (req, res, next) { | |
| res.setHeader('Access-Control-Allow-Origin', '*'); | |
| next(); |
| var Bar1 = base => class extends base { | |
| componentWillMount(){ | |
| super.componentWillMount(); | |
| console.log('Bar1'); | |
| } | |
| }; | |
| var Bar2 = base => class extends base { | |
| componentWillMount(){ | |
| super.componentWillMount(); |
| { | |
| "name": "my-app", | |
| "version": "1.0.0", | |
| "description": "My test app", | |
| "main": "src/js/index.js", | |
| "scripts": { | |
| "jshint:dist": "jshint src/js/*.js", | |
| "jshint": "npm run jshint:dist", | |
| "jscs": "jscs src/*.js", | |
| "browserify": "browserify -s Validating -o ./dist/js/build.js ./lib/index.js", |
| <script type="text/javascript"> | |
| (function () { | |
| "use strict"; | |
| // once cached, the css file is stored on the client forever unless | |
| // the URL below is changed. Any change will invalidate the cache | |
| var css_href = './index_files/web-fonts.css'; | |
| // a simple event handler wrapper | |
| function on(el, ev, callback) { | |
| if (el.addEventListener) { | |
| el.addEventListener(ev, callback, false); |
I wanted to figure out the fastest way to load non-critical CSS so that the impact on initial page drawing is minimal.
TL;DR: Here's the solution I ended up with: https://github.com/filamentgroup/loadCSS/
For async JavaScript file requests, we have the async attribute to make this easy, but CSS file requests have no similar standard mechanism (at least, none that will still apply the CSS after loading - here are some async CSS loading conditions that do apply when CSS is inapplicable to media: https://gist.github.com/igrigorik/2935269#file-notes-md ).
Seems there are a couple ways to load and apply a CSS file in a non-blocking manner:
| require "swift-mailer-510/lib/swift_required.php"; | |
| $message = Swift_Message::newInstance() | |
| ->setCharset('utf-8') | |
| ->setSubject('Your subject') | |
| ->setFrom(array('from@example.com' => 'From Name')) | |
| ->setTo(array('to@example.com' => 'To Name')) | |
| ->setBody('Here is the message itself') | |
| ->addPart('<q>Here is the message itself</q>', 'text/html') | |
| ; |
| // npm i gulp event-stream | |
| var gulp = require('gulp'); | |
| var es = require('event-stream'); | |
| gulp.task('test', function(cb) { | |
| return es.concat( | |
| gulp.src('bootstrap/js/*.js') | |
| .pipe(gulp.dest('public/bootstrap')), | |
| gulp.src('jquery.cookie/jquery.cookie.js') |
| module.exports = function(grunt) { | |
| grunt.initConfig({ | |
| pkg: grunt.file.readJSON('package.json'), | |
| concat: { | |
| options: { | |
| separator: ';' | |
| }, | |
| dist: { | |
| src: ['src/**/*.js'], | |
| dest: 'dist/<%= pkg.name %>.js' |
I recently published rework-npm that allows you to import CSS files using the same rules that the Node.js uses for modules. This lets you install and manage CSS packages using npm the same way you manage JS modules.
First of all, why use npm? Why does it make sense to use npm for CSS? Npm is good for a number of reasons.
First, it is simple to use. Want to publish a module? Just use npm publish. Want to install a new package and save it to the dependencies? Just use npm install --save mymodule. This makes it super easy to create and maintain small modules, instead of putting everything into one large module.