Cache bugfixes/improvements

package.json

@@ -14,6 +14,7 @@
     "babylon": "^6.17.4",
     "babylon-walk": "^1.0.2",
     "browser-resolve": "^1.11.2",
+    "canonical-json": "0.0.4",
     "chalk": "^2.1.0",
     "chokidar": "^1.7.0",
     "commander": "^2.11.0",

src/Asset.js

@@ -33,6 +33,7 @@ class Asset {
     this.depAssets = new Map();
     this.parentBundle = null;
     this.bundles = new Set();
+    this.config = {};
   }
 
   async loadIfNeeded() {
@@ -90,6 +91,11 @@ class Asset {
     return await fs.readFile(this.name, this.encoding);
   }
 
+  async getConfig() {
+    // do nothing
+    return this.config;
+  }
+
   parse() {
     // do nothing by default
   }
@@ -112,6 +118,7 @@ class Asset {
 
   async process() {
     if (!this.generated) {
+      await this.getConfig();
       await this.loadIfNeeded();
       await this.pretransform();
       await this.getDependencies();

src/Bundler.js

@@ -13,6 +13,8 @@ const Logger = require('./Logger');
 const PackagerRegistry = require('./packagers');
 const localRequire = require('./utils/localRequire');
 const config = require('./utils/config');
+const configCache = require('./utils/configCache');
+const objectHash = require('./utils/objectHash');
 const emoji = require('./utils/emoji');
 
 /**
@@ -41,6 +43,7 @@ class Bundler extends EventEmitter {
     this.errored = false;
     this.buildQueue = new Set();
     this.rebuildTimeout = null;
+    this.plugins = [];
   }
 
   normalizeOptions(options) {
@@ -98,6 +101,10 @@ class Bundler extends EventEmitter {
       let deps = Object.assign({}, pkg.dependencies, pkg.devDependencies);
       for (let dep in deps) {
         if (dep.startsWith('parcel-plugin-')) {
+          this.plugins.push({
+            name: dep,
+            version: deps[dep]
+          });
           let plugin = await localRequire(dep, this.mainFile);
           plugin(this);
         }
@@ -169,12 +176,27 @@ class Bundler extends EventEmitter {
     }
   }
 
+  async createVersionHash() {
+    let pkg = await config.load(this.mainFile, ['package.json']);
+    if (!pkg) {
+      return '';
+    }
+
+    let versionObject = {
+      plugins: this.plugins,
+      version: pkg.version,
+      name: pkg.name
+    };
+    return objectHash(versionObject);
+  }
+
   async start() {
     if (this.farm) {
       return;
     }
 
     await this.loadPlugins();
+    this.versionHash = await this.createVersionHash();
 
     this.options.extensions = Object.assign({}, this.parser.extensions);
     this.farm = WorkerFarm.getShared(this.options);
@@ -313,8 +335,16 @@ class Bundler extends EventEmitter {
 
     // First try the cache, otherwise load and compile in the background
     let processed = this.cache && (await this.cache.read(asset.name));
-    if (!processed) {
+    let sameConfig = false;
+    if (processed) {
+      sameConfig = await configCache.compare(asset, processed.configCache);
+      sameConfig = sameConfig
+        ? processed.versionHash === this.versionHash
+        : false;
+    }
+    if (!processed || !sameConfig) {
       processed = await this.farm.run(asset.name, asset.package, this.options);
+      processed.versionHash = this.versionHash;
       if (this.cache) {
         this.cache.write(asset.name, processed);
       }

src/assets/CSSAsset.js

@@ -22,6 +22,12 @@ class CSSAsset extends Asset {
     );
   }
 
+  async getConfig() {
+    await postcssTransform.getConfig(this);
+
+    return this.config;
+  }
+
   parse(code) {
     let root = postcss.parse(code, {from: this.name, to: this.name});
     return new CSSAst(code, root);
@@ -85,7 +91,7 @@ class CSSAsset extends Asset {
   }
 
   async transform() {
-    await postcssTransform(this);
+    await postcssTransform.parse(this);
   }
 
   getCSSAst() {

src/assets/HTMLAsset.js

@@ -30,6 +30,12 @@ class HTMLAsset extends Asset {
     this.isAstDirty = false;
   }
 
+  async getConfig() {
+    await posthtmlTransform.getConfig(this);
+
+    return this.config;
+  }
+
   parse(code) {
     let res = parse(code);
     res.walk = api.walk;
@@ -58,7 +64,7 @@ class HTMLAsset extends Asset {
   }
 
   async transform() {
-    await posthtmlTransform(this);
+    await posthtmlTransform.parse(this);
   }
 
   generate() {

src/assets/JSAsset.js

@@ -34,9 +34,13 @@ class JSAsset extends Asset {
     );
   }
 
-  async getParserOptions() {
+  async getConfig() {
+    if (this.config.babelOptions && this.config.babelConfig) {
+      return this.config;
+    }
+
     // Babylon options. We enable a few plugins by default.
-    const options = {
+    this.config.babelOptions = {
       filename: this.name,
       allowReturnOutsideFunction: true,
       allowHashBang: true,
@@ -48,21 +52,19 @@ class JSAsset extends Asset {
     };
 
     // Check if there is a babel config file. If so, determine which parser plugins to enable
-    this.babelConfig =
+    this.config.babelConfig =
       (this.package && this.package.babel) ||
       (await config.load(this.name, ['.babelrc', '.babelrc.js']));
-    if (this.babelConfig) {
+    if (this.config.babelConfig) {
       const file = new BabelFile({filename: this.name});
-      options.plugins.push(...file.parserOpts.plugins);
+      this.config.babelOptions.plugins.push(...file.parserOpts.plugins);
     }
 
-    return options;
+    return this.config;
   }
 
   async parse(code) {
-    const options = await this.getParserOptions();
-
-    return babylon.parse(code, options);
+    return babylon.parse(code, this.config.babelOptions);
   }
 
   traverse(visitor) {

src/assets/JSONAsset.js

@@ -5,6 +5,9 @@ class JSONAsset extends JSAsset {
     return 'module.exports = ' + (await super.load()) + ';';
   }
 
+  async getConfig() {
+    return this.config;
+  }
   parse() {}
   collectDependencies() {}
   pretransform() {}

src/assets/LESSAsset.js

@@ -4,19 +4,31 @@ const localRequire = require('../utils/localRequire');
 const promisify = require('../utils/promisify');
 
 class LESSAsset extends CSSAsset {
-  async parse(code) {
-    // less should be installed locally in the module that's being required
-    let less = await localRequire('less', this.name);
-    let render = promisify(less.render.bind(less));
+  async getConfig() {
+    await super.getConfig();
 
-    let opts =
+    if (this.config.less) {
+      return this.config;
+    }
+
+    this.config.less =
       this.package.less ||
       (await config.load(this.name, ['.lessrc', '.lessrc.js'])) ||
       {};
-    opts.filename = this.name;
-    opts.plugins = (opts.plugins || []).concat(urlPlugin(this));
+    this.config.less.filename = this.name;
+    this.config.less.plugins = (this.config.less.plugins || []).concat(
+      urlPlugin(this)
+    );
+
+    return this.config;
+  }
+
+  async parse(code) {
+    // less should be installed locally in the module that's being required
+    let less = await localRequire('less', this.name);
+    let render = promisify(less.render.bind(less));
 
-    let res = await render(code, opts);
+    let res = await render(code, this.config.less);
     res.render = () => res.css;
     return res;
   }

src/assets/SASSAsset.js

@@ -5,23 +5,36 @@ const promisify = require('../utils/promisify');
 const path = require('path');
 
 class SASSAsset extends CSSAsset {
+  async getConfig() {
+    await super.getConfig();
+
+    if (this.config.sass) {
+      return this.config;
+    }
+
+    this.config.sass =
+      this.package.sass ||
+      (await config.load(this.name, ['.sassrc', '.sassrc.js'])) ||
+      {};
+    this.config.sass.includePaths = (
+      this.config.sass.includePaths || []
+    ).concat(path.dirname(this.name));
+
+    this.config.sass.indentedSyntax =
+      typeof this.config.sass.indentedSyntax === 'boolean'
+        ? this.config.sass.indentedSyntax
+        : path.extname(this.name).toLowerCase() === '.sass';
+
+    return this.config;
+  }
+
   async parse(code) {
     // node-sass should be installed locally in the module that's being required
     let sass = await localRequire('node-sass', this.name);
     let render = promisify(sass.render.bind(sass));
 
-    let opts =
-      this.package.sass ||
-      (await config.load(this.name, ['.sassrc', '.sassrc.js'])) ||
-      {};
-    opts.includePaths = (opts.includePaths || []).concat(
-      path.dirname(this.name)
-    );
+    let opts = this.config.sass;
     opts.data = code;
-    opts.indentedSyntax =
-      typeof opts.indentedSyntax === 'boolean'
-        ? opts.indentedSyntax
-        : path.extname(this.name).toLowerCase() === '.sass';
 
     opts.functions = Object.assign({}, opts.functions, {
       url: node => {

src/assets/StylusAsset.js

@@ -6,13 +6,24 @@ const Resolver = require('../Resolver');
 const URL_RE = /^(?:url\s*\(\s*)?['"]?(?:[#/]|(?:https?:)?\/\/)/i;
 
 class StylusAsset extends CSSAsset {
+  async getConfig() {
+    await super.getConfig();
+
+    if (this.config.stylus) {
+      return this.config;
+    }
+
+    this.config.stylus =
+      this.package.stylus ||
+      (await config.load(this.name, ['.stylusrc', '.stylusrc.js']));
+
+    return this.config;
+  }
+
   async parse(code) {
     // stylus should be installed locally in the module that's being required
     let stylus = await localRequire('stylus', this.name);
-    let opts =
-      this.package.stylus ||
-      (await config.load(this.name, ['.stylusrc', '.stylusrc.js']));
-    let style = stylus(code, opts);
+    let style = stylus(code, this.config.stylus);
     style.set('filename', this.name);
     style.set('include css', true);
     style.set('Evaluator', await createEvaluator(this));

src/assets/TypeScriptAsset.js

@@ -3,10 +3,15 @@ const config = require('../utils/config');
 const localRequire = require('../utils/localRequire');
 
 class TypeScriptAsset extends JSAsset {
-  async parse(code) {
-    // require typescript, installed locally in the app
+  async getConfig() {
+    await super.getConfig();
     let typescript = await localRequire('typescript', this.name);
-    let transpilerOptions = {
+
+    if (this.config.typescript) {
+      return this.config;
+    }
+
+    this.config.typescript = {
       compilerOptions: {
         module: typescript.ModuleKind.CommonJS,
         jsx: typescript.JsxEmit.Preserve
@@ -18,19 +23,26 @@ class TypeScriptAsset extends JSAsset {
 
     // Overwrite default if config is found
     if (tsconfig) {
-      transpilerOptions.compilerOptions = Object.assign(
-        transpilerOptions.compilerOptions,
+      this.config.typescript.compilerOptions = Object.assign(
+        this.config.typescript.compilerOptions,
         tsconfig.compilerOptions
       );
     }
-    transpilerOptions.compilerOptions.noEmit = false;
+    this.config.typescript.compilerOptions.noEmit = false;
+
+    return this.config.typescript;
+  }
+
+  async parse(code) {
+    let typescript = await localRequire('typescript', this.name);
 
     // Transpile Module using TypeScript and parse result as ast format through babylon
     this.contents = typescript.transpileModule(
       code,
-      transpilerOptions
+      this.config.typescript
     ).outputText;
-    return await super.parse(this.contents);
+
+    return super.parse(this.contents);
   }
 }
 

src/transforms/babel.js

@@ -1,5 +1,4 @@
 const babel = require('babel-core');
-const config = require('../utils/config');
 
 module.exports = async function(asset) {
   if (!await shouldTransform(asset)) {
@@ -30,13 +29,14 @@ async function shouldTransform(asset) {
   }
 
   if (asset.ast) {
-    return !!asset.babelConfig;
+    return !!asset.config.babelConfig;
   }
 
   if (asset.package && asset.package.babel) {
     return true;
   }
 
-  let babelrc = await config.resolve(asset.name, ['.babelrc', '.babelrc.js']);
+  await asset.getConfig();
+  let babelrc = asset.config.babelConfig;
   return !!babelrc;
 }