diff --git a/babel-preset/configs/main.js b/babel-preset/configs/main.js
index 0b972f595..e6aeeec39 100644
--- a/babel-preset/configs/main.js
+++ b/babel-preset/configs/main.js
@@ -52,6 +52,7 @@ const exponentiationOperator = [
 ];
 const objectAssign = [require('@babel/plugin-transform-object-assign')];
 const objectRestSpread = [require('@babel/plugin-proposal-object-rest-spread')];
+const optionalChaining = [require('@babel/plugin-proposal-optional-chaining')];
 const reactDisplayName = [
   require('@babel/plugin-transform-react-display-name'),
 ];
@@ -98,6 +99,9 @@ const getPreset = (src, options) => {
   ) {
     extraPlugins.push(reactDisplayName);
   }
+  if (isNull || src.indexOf('?.') !== -1) {
+    extraPlugins.push(optionalChaining);
+  }
 
   if (options && options.dev) {
     extraPlugins.push(reactJsxSource);
diff --git a/babel-preset/package.json b/babel-preset/package.json
index 691941cf3..b69d3d301 100644
--- a/babel-preset/package.json
+++ b/babel-preset/package.json
@@ -17,6 +17,7 @@
   "dependencies": {
     "@babel/plugin-proposal-class-properties": "7.0.0-beta.40",
     "@babel/plugin-proposal-object-rest-spread": "7.0.0-beta.40",
+    "@babel/plugin-proposal-optional-chaining": "7.0.0-beta.40",
     "@babel/plugin-transform-arrow-functions": "7.0.0-beta.40",
     "@babel/plugin-transform-block-scoping": "7.0.0-beta.40",
     "@babel/plugin-transform-classes": "7.0.0-beta.40",