关于mobx:bug-solved-This-experimental-syntax-requires-enabling-xxx

35次阅读

共计 1534 个字符，预计需要花费 4 分钟才能阅读完成。

另外，这俩问题是我在 mobx 中应用 ES7 装璜器语法用到的，用一般的 ES6 语法是不会碰到这样的问题，嫌麻烦也能够不必装璜器语法，奈何我对这种看上去像 Spring 正文的语法垂涎已久。

Experimental support for decorators is a feature that is subject to change in a future release. Set the ‘experimentalDecorators’ option in your ‘tsconfig’ or ‘jsconfig’ to remove this warning.ts(1219)

问题出在 IDE 不意识这个语法以 vscode 为例须要在 setting 中搜“experimentalDecorators”而后勾选上

Parsing error: This experimental syntax requires enabling one of the following parser plugin(s): “decorators”, “decorators-legacy”. (22:4)eslint

问题出在我的项目自身不意识这个语法（以后这个语法还在试验阶段 babel 还没有正式公布），这个解决起来略微有点麻烦，翻了很久 stackoverflow 和 github issue，答复都是支支吾吾遮遮掩掩，故作此篇，以飨前人。

step1:

npm i @babel/core @babel/plugin-proposal-decorators @babel/preset-env

step2:
我的项目根目录下创立.babelrc

{"presets": ["@babel/preset-env"],
  "plugins": [["@babel/plugin-proposal-decorators", { "legacy": true}]]
}

step3:
我的项目根目录下创立 config-overrides.js

const path = require('path')
const {override, addDecoratorsLegacy} = require('customize-cra')
function resolve(dir) {return path.join(__dirname, dir) }
const customize = () => (config, env) => {config.resolve.alias['@'] = resolve('src')
    if (env === 'production') {config.externals = { 'react': 'React', 'react-dom': 'ReactDOM'} }
    return config
}; module.exports = override(addDecoratorsLegacy(), customize())

step4:
npm i customize-cra react-app-rewired

step5:
批改 package.json

  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-app-rewired eject"
  },

而后重启服务器再次 npm start

报错 Plugin “react” was conflicted between “package.json …
而后关上 package.json ctrl/command + s 就好啦

（最初这里 vscode 如果出问题，，重启服务器不论用，能够尝试换了一个 IDE 比方 webstorm）

happy hacking~

正文完