Error on npm install

[kangax]

Trying to npm install in a freshly-pulled repository throws:

SyntaxError: <...>/draft-js/src/component/base/DraftEditor.react.js: Missing class properties transform.

Full log:

https://gist.github.com/kangax/f02a97fca90c6b1b8b01a70259bea3b5

Could it be that https://babeljs.io/docs/plugins/transform-class-properties is somehow missing from installed dependencies?

[davidchang]

@kangax - thanks for opening the issue :| Sorry it's taken us more than 2 weeks to respond. I just pulled down master and ran

npm cache clean && npm install

and didn't have any issues (node v6.3.1, npm v3.10.3). would you mind trying again and i'll make sure to respond in a more timely manner?

[kangax]

@davidchang hm, I'm still seeing this. I'm running this within git submodule under babili repo.

Just did this:

> rm -rf draft-js
> git submodule add https://github.com/facebook/draft-js draft-js
> 'scripts/draft-js' already exists in the index
> git submodule update draft-js
> Submodule path 'draft-js': checked out '437410bd9dfc18077064848bab09c8da7075f09e'
> cd draft-js
> npm cache clean && npm install
> ...
> draft-js@0.9.0 build /Users/kangax/dev/babili/scripts/draft-js
> ...
> [12:58:12] Starting 'flow'...
> ...
> SyntaxError: /Users/kangax/dev/babili/scripts/draft-js/src/component/base/DraftEditor.react.js: Missing class properties transform.

[kangax]

Just checked clean install (not as submodule) and, as expected, npm install works. So it must be something about the fact that it's under another repo that throws flow off?

@gabelevi any idea what it could be?

[kangax]

Looks like it's not specifically Flow. If I add plugins: ['transform-class-properties'] to both babelOptsJS and babelOptsFlow, npm install finishes successfully. This is pretty strange.

[kangax]

Ok, I had to add plugins: ['transform-class-properties'] to jest preprocessor as well :) Now all tests pass (with source being minified with Babili) but I wish we could still get to the bottom of this.

[fisx]

how / where do i add this to the jest preprocessor?

[fisx]

this didn't do the trick:

diff --git a/scripts/jest/preprocessor.js b/scripts/jest/preprocessor.js
index b9ea9fa..38c0499 100644
--- a/scripts/jest/preprocessor.js
+++ b/scripts/jest/preprocessor.js
@@ -16,6 +16,7 @@ var path = require('path');
 module.exports = {
   process(src, filename) {
     var options = {
+      plugins: ['transform-class-properties'],
       presets: [fbjsConfigurePreset({rewriteModules: {map: moduleMap}})],

[fisx]

oh, wait. gulpfile.js is generated. if i change it and then run gulp, gulp passes.

so where else should i add the plugins if not to gulpfile.js?

this works. thanks! (-:

$ git diff
diff --git a/gulpfile.js b/gulpfile.js
index 5ddc4da..8314519 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -43,6 +43,7 @@ var paths = {
 };
 
 var babelOptsJS = {
+  plugins: ['transform-class-properties'],
   presets: [
     fbjsConfigurePreset({
       stripDEV: true,
@@ -52,6 +53,7 @@ var babelOptsJS = {
 };
 
 var babelOptsFlow = {
+  plugins: ['transform-class-properties'],
   presets: [
     fbjsConfigurePreset({
       target: 'flow',
diff --git a/scripts/jest/preprocessor.js b/scripts/jest/preprocessor.js
index b9ea9fa..38c0499 100644
--- a/scripts/jest/preprocessor.js
+++ b/scripts/jest/preprocessor.js
@@ -16,6 +16,7 @@ var path = require('path');
 module.exports = {
   process(src, filename) {
     var options = {
+      plugins: ['transform-class-properties'],
       presets: [fbjsConfigurePreset({rewriteModules: {map: moduleMap}})],
       filename: filename,
       retainLines: true,