search

oliviertassinari / babel-plugin-transform-react-remove-prop-types

Remove unnecessary React propTypes from the production build. :balloon:
MIT License
897 stars 61 forks source link

Conflicts with lodash-webpack-plugin #125

Closed marcoturi closed 7 years ago

marcoturi commented 7 years ago

babel conf: (note: if I remove the part of transform-react-remove-prop-types, I get no errors)

"plugins": [
          "lodash",
          "transform-react-constant-elements",
          "transform-react-inline-elements",
          [
            "transform-react-remove-prop-types",
            {
              "mode": "wrap",
              "ignoreFilenames": ["node_modules"],
              "plugins": [
                [
                  "babel-plugin-flow-react-proptypes",
                  {
                    "omitRuntimeTypeExport": true
                  }
                ],
                "babel-plugin-transform-flow-strip-types"
              ]
            }
          ]
        ]

Webpack Plugins:

plugins: [
    // new webpack.optimize.ModuleConcatenationPlugin(),

    new LodashModuleReplacementPlugin({
      collections: true,
      paths: true,
      shorthands: true,
      currying: true,
    }),

    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      minChunks: (module) => module.context && module.context.indexOf('node_modules') >= 0,
    }),

    new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: false,
        pure_getters: true,
        unsafe: true,
        unsafe_comps: true,
        screw_ie8: true,
        conditionals: true,
        unused: true,
        comparisons: true,
        sequences: true,
        dead_code: true,
        evaluate: true,
        if_return: true,
        join_vars: true,
      },
      output: {
        comments: false,
      },
      exclude: [/\.min\.js$/gi], // skip pre-minified libs
    }),

    // Minify and optimize the index.html
    new HtmlWebpackPlugin({
      template: 'src/index.html',
      minify: {
        removeComments: true,
        collapseWhitespace: true,
        removeRedundantAttributes: true,
        useShortDoctype: true,
        removeEmptyAttributes: true,
        removeStyleLinkTypeAttributes: true,
        keepClosingSlash: true,
        minifyJS: true,
        minifyCSS: true,
        minifyURLs: true,
      },
      inject: true,
    }),
  ],

Package versions:

 "dependencies": {
    "algoliasearch": "3.24.3",
    "auth0-js": "8.10.0",
    "auth0-lock": "10.9.2",
    "axios": "0.16.2",
    "babel-polyfill": "6.23.0",
    "classnames": "^2.2.5",
    "date-fns": "^1.29.0",
    "global": "4.3.2",
    "history": "^4.7.2",
    "hsl-to-hex": "^1.0.0",
    "lodash": "4.17.4",
    "material-ui": "1.0.0-beta.17",
    "material-ui-icons": "^1.0.0-beta.17",
    "normalizr": "^3.2.3",
    "prop-types": "^15.6.0",
    "raven-js": "3.17.0",
    "react": "15.6.1",
    "react-dom": "15.6.1",
    "react-intl": "^2.3.0",
    "react-load-script": "^0.0.6",
    "react-redux": "5.0.6",
    "react-router-dom": "4.2.2",
    "react-router-redux": "^5.0.0-alpha.6",
    "react-tap-event-plugin": "2.0.1",
    "recompose": "0.23.4",
    "redux": "3.7.2",
    "redux-devtools-extension": "2.13.2",
    "redux-form": "^7.0.4",
    "redux-form-material-ui": "^5.0.0-beta.1",
    "redux-immutable-state-invariant": "2.0.0",
    "redux-logger": "2.8.1",
    "redux-mock-store": "1.2.2",
    "redux-promise-middleware": "4.3.0",
    "redux-thunk": "2.1.0",
    "reselect": "2.5.4",
    "uuid": "^3.1.0",
    "validator": "^8.2.0"
  },
  "devDependencies": {
    "add-asset-html-webpack-plugin": "2.0.1",
    "babel-cli": "^6.24.1",
    "babel-eslint": "^7.2.3",
    "babel-loader": "7.1.0",
    "babel-plugin-dynamic-import-node": "1.0.2",
    "babel-plugin-flow-react-proptypes": "7.0.1",
    "babel-plugin-istanbul": "^4.1.4",
    "babel-plugin-lodash": "^3.2.11",
    "babel-plugin-react-transform": "2.0.2",
    "babel-plugin-transform-es2015-modules-commonjs": "6.24.1",
    "babel-plugin-transform-flow-strip-types": "^6.22.0",
    "babel-plugin-transform-react-constant-elements": "6.23.0",
    "babel-plugin-transform-react-inline-elements": "6.22.0",
    "babel-plugin-transform-react-remove-prop-types": "0.4.10",
    "babel-preset-env": "1.5.1",
    "babel-preset-react": "6.24.1",
    "babel-preset-stage-2": "6.24.1",
    "babel-register": "^6.24.1",
    "better-npm-run": "0.1.0",
    "chai": "^3.5.0",
    "chai-enzyme": "^0.6.1",
    "chai-jquery": "^2.0.0",
    "chalk": "^2.1.0",
    "cheerio": "0.22.0",
    "circular-dependency-plugin": "3.0.0",
    "commitizen": "^2.9.6",
    "compression": "^1.7.0",
    "enzyme": "2.9.1",
    "eslint": "3.19.0",
    "eslint-config-airbnb": "15.1.0",
    "eslint-config-airbnb-base": "11.3.1",
    "eslint-plugin-flowtype": "2.39.1",
    "eslint-plugin-import": "2.8.0",
    "eslint-plugin-jsx-a11y": "5.1.1",
    "eslint-plugin-mocha": "4.11.0",
    "eslint-plugin-promise": "3.5.0",
    "eslint-plugin-react": "7.2.1",
    "eslint-plugin-standard": "3.0.1",
    "eslint-watch": "^3.1.2",
    "express": "4.15.4",
    "file-loader": "0.11.1",
    "flow-bin": "^0.54.1",
    "flow-typed": "^2.1.5",
    "git-changelog": "^1.1.2",
    "glob": "7.1.2",
    "html-loader": "0.4.5",
    "html-webpack-plugin": "2.29.0",
    "ignore-styles": "5.0.1",
    "image-webpack-loader": "2.0.0",
    "imports-loader": "0.7.1",
    "ip": "^1.1.5",
    "jquery": "^3.2.1",
    "jsdom": "11.1.0",
    "json-loader": "^0.5.7",
    "lint-staged": "^4.0.3",
    "lodash-webpack-plugin": "^0.11.4",
    "minimist": "^1.2.0",
    "mocha": "3.5.0",
    "mock-local-storage": "^1.0.4",
    "node-sass": "4.5.3",
    "npm-run-all": "^4.0.2",
    "nyc": "^11.1.0",
    "react-addons-test-utils": "^15.4.1",
    "shelljs": "^0.7.8",
    "sinon": "^1.17.7",
    "standard-version": "^4.2.0",
    "validate-commit-msg": "^2.14.0",
    "webpack": "3.5.5",
    "webpack-dev-middleware": "1.11.0",
    "webpack-hot-middleware": "2.18.0"
  },

The error:

Module build failed: AssertionError: /Users/marco/Sources/Topcon/ta-subscriptions-fe/src/index.jsx: path must be a string
    at Module.require (module.js:496:3)
    at require (internal/module.js:20:19)
    at /Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-plugin-transform-react-remove-prop-types/lib/index.js:36:26
    at Array.map (native)
    at PluginPass.Program (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-plugin-transform-react-remove-prop-types/lib/index.js:34:52)
    at newFn (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/visitors.js:276:21)
    at NodePath._call (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/path/context.js:76:18)
    at NodePath.call (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/path/context.js:48:17)
    at NodePath.visit (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/path/context.js:105:12)
    at TraversalContext.visitQueue (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/context.js:150:16)
    at TraversalContext.visitSingle (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/context.js:108:19)
    at TraversalContext.visit (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/context.js:192:19)
    at Function.traverse.node (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/index.js:114:17)
    at traverse (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-traverse/lib/index.js:79:12)
    at File.transform (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-core/lib/transformation/file/index.js:548:35)
    at /Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-core/lib/transformation/pipeline.js:50:19
    at File.wrap (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-core/lib/transformation/file/index.js:564:16)
    at Pipeline.transform (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-core/lib/transformation/pipeline.js:47:17)
    at transpile (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-loader/lib/index.js:49:20)
    at Object.module.exports (/Users/marco/Sources/Topcon/ta-subscriptions-fe/node_modules/babel-loader/lib/index.js:171:20)
 @ multi ./src/index.jsx

The slice of code that throws the error, index.js 34:

  var pluginsVisitors = state.opts.plugins.map(function (pluginName) {
            var plugin = require(pluginName); <-- this line
            return plugin({ template: template, types: types }).visitor;
          });
oliviertassinari commented 7 years ago

I don't understand what's going on. Could you print the value of state.opts.plugins?

marcoturi commented 7 years ago

Unfortunatly i'm not able to reproduce it anymore. Anyway yesterday I tried to console.log pluginName and the response was:

[
                  "babel-plugin-flow-react-proptypes",
                  {
                    "omitRuntimeTypeExport": true
                  }
                ]

Feel free to close it anyway.

oliviertassinari commented 7 years ago

@marcoturi I suspect an issue with the installation of the dependencies. Thanks for letting me know!