react-with-direction
react-with-direction copied to clipboard
Impact babel-plugin-transform-replace-object-assign
i getting the following error while importing DateRangePicker lib.
Configuring module specifier with a string is no longer supported. Configure with { "moduleSpecifier": "object.assign" } instead of "object.assign".
ERROR in ./node_modules/react-with-direction/dist/proptypes/brcast.js Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: C:/work/POC/pq-client-develop/node_modules/react-with-direction/dist/proptypes/brcast.js: Configuring module specifier with a string is no longer supported. Configure with { "moduleSpecifier": "object.assign" } instead of "object.assign". at PluginPass.exit (C:\work\POC\pq-client-develop\node_modules\babel-plugin-transform-replace-object-assign\lib\index.js:23:19) at newFn (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\visitors.js:276:21) at NodePath._call (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\path\context.js:76:18) at NodePath.call (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\path\context.js:48:17) at NodePath.visit (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\path\context.js:117:8) at TraversalContext.visitQueue (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\context.js:150:16) at TraversalContext.visitSingle (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\context.js:108:19) at TraversalContext.visit (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\context.js:192:19) at Function.traverse.node (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\index.js:114:17) at traverse (C:\work\POC\pq-client-develop\node_modules\babel-traverse\lib\index.js:79:12) at File.transform (C:\work\POC\pq-client-develop\node_modules\babel-core\lib\transformation\file\index.js:516:35) at C:\work\POC\pq-client-develop\node_modules\babel-core\lib\transformation\pipeline.js:50:19 at File.wrap (C:\work\POC\pq-client-develop\node_modules\babel-core\lib\transformation\file\index.js:532:16) at Pipeline.transform (C:\work\POC\pq-client-develop\node_modules\babel-core\lib\transformation\pipeline.js:47:17) at transpile (C:\work\POC\pq-client-develop\node_modules\babel-loader\lib\index.js:50:20) at C:\work\POC\pq-client-develop\node_modules\babel-loader\lib\fs-cache.js:118:18 @ ./node_modules/react-with-styles/lib/withStyles.js 50:14-67 @ ./node_modules/react-dates/lib/components/CalendarMonth.js @ ./node_modules/react-dates/lib/index.js @ ./node_modules/react-dates/index.js @ ./src/js/components/CourseInfo/courseInfo.jsx @ ./src/js/components/CourseInfo/index.js @ ./src/js/components/index.js @ ./src/js/index.js @ multi (webpack)-dev-server/client?http://0.0.0.0:9000 ./src/js/index.js
i stuck by this.
Ref: https://github.com/newoga/babel-plugin-transform-replace-object-assign
Are you transpiling your node_modules, something you should never do?
I'm quite sure that's the issue, so I'm going to close this.
In webpack i'm excluding nodemodules and including @salesforce & @salesforce-ux only. i have attached my webpack babelloader & babelrc
let babelLoader = {
test: /\.(js|jsx)$/,
exclude: /node_modules\/(?!(@salesforce | @salesforce-ux)\/).*/,
use: {
loader: "babel-loader",
options: {
presets: ['babel-preset-env', 'es2015', 'react', '@salesforce/babel-preset-design-system-react'],
plugins: [require('babel-plugin-transform-object-rest-spread'), 'dynamic-import-webpack', 'transform-object-assign'],
cacheDirectory: true
}
}
};
.babelrc
{
"presets": [
"latest",
"react",
"stage-1"
]
}
and do those @salesforce
packages that you're transpiling include any third party dependencies inside their node_module dirs?
yes, they are transpling some node_modules.
module.exports = function buildPreset () { return { presets: [ require('babel-preset-env').default(null, { targets: { browsers: ['last 2 versions', 'ie 11'], node: '8.9.4', }, }), require('babel-preset-react'), ], plugins: [ require('babel-plugin-transform-object-rest-spread'), require('babel-plugin-transform-class-properties'), require('babel-plugin-transform-export-extensions'), ], }; };
@salesforce
-
babel-preset-design-system-react Ref for modules they included : https://www.npmjs.com/package/@salesforce/babel-preset-design-system-react
-
design-system-react folder includes there component.
@salesforce-ux
UI asserts will be taken care here.
i have enclosed the design system site of salesforce:
https://react.lightningdesignsystem.com/getting-started/
npm install @salesforce-ux/design-system @salesforce/design-system-react
I’m not sure how this problem could occur; but any time you get a babel config error from inside node_modules, it’s that your babel config is broken (ie, it’s transpiling node_modules). There’s nothing that this package or i can really do to fix this from the consuming package side - all we could do is make a change to avoid that specific error, but it wouldn’t fix the root problem.