2
我一直在努力使我的React項目MobX工作。 我已經按照babelrc配置，也安裝了transform-decorators-legacy，但似乎我在嘗試運行我的項目後得到Parsing error: Unexpected character @。es7的babelrc配置裝飾不工作
這裏是我的babelrc：
{
"presets": [
"es2015",
"react",
"stage-1"
],
"plugins": ["transform-decorators-legacy"]
}
的WebPack開發配置：
import webpack from 'webpack';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import autoprefixer from 'autoprefixer';
export default {
debug: true,
devtool: 'cheap-module-eval-source-map',
noInfo: true,
entry: [
'./src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'./src/index'
],
target: 'web',
output: {
path: `${__dirname}/src`,
publicPath: '/',
filename: 'bundle.js'
},
plugins: [
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development'),
__DEV__: true
}),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new HtmlWebpackPlugin({
template: 'src/index.ejs',
minify: {
removeComments: true,
collapseWhitespace: true
},
inject: true
})
],
module: {
loaders: [
{test: /\.js$/, exclude: /node_modules/, loaders: ['babel']},
{test: /\.eot(\?v=\d+.\d+.\d+)?$/, loader: 'file'},
{test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url?limit=10000&mimetype=application/font-woff"},
{test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/octet-stream'},
{test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=image/svg+xml'},
{test: /\.(jpe?g|png|gif)$/i, loader: 'file?name=[name].[ext]'},
{test: /\.ico$/, loader: 'file?name=[name].[ext]'},
{test: /(\.css|\.scss)$/, loaders: ['style', 'css?sourceMap', 'postcss', 'sass?sourceMap']}
]
},
postcss:()=> [autoprefixer]
};
什麼我錯過了嗎？
這裏是代碼，給出了錯誤（Store.js）：
import { autorun, observable } from 'mobx';
class appStore {
@observable userSession = { /*error at this line (4:2) at @observable*/
isUserLogged: false,
id: 0,
name: '',
token: '',
memberId: 0,
membershipId: 1000
}
}
這裏是我的.eslintrc文件：
{
"extends": [
"eslint:recommended",
"plugin:import/errors",
"plugin:import/warnings"
],
"plugins": [
"react"
],
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
"experimentalObjectRestSpread": true
}
},
"env": {
"es6": true,
"browser": true,
"node": true,
"jquery": true,
"mocha": true
},
"rules": {
"quotes": 0,
"no-console": 1,
"no-debugger": 1,
"no-var": 1,
"semi": [1, "always"],
"no-trailing-spaces": 0,
"eol-last": 0,
"no-underscore-dangle": 0,
"no-alert": 0,
"no-lone-blocks": 0,
"jsx-quotes": 1,
"react/display-name": [ 1, {"ignoreTranspilerName": false }],
"react/forbid-prop-types": [1, {"forbid": ["any"]}],
"react/jsx-boolean-value": 0,
"react/jsx-closing-bracket-location": 0,
"react/jsx-curly-spacing": 1,
"react/jsx-indent-props": 0,
"react/jsx-key": 1,
"react/jsx-max-props-per-line": 0,
"react/jsx-no-bind": 0,
"react/jsx-no-duplicate-props": 1,
"react/jsx-no-literals": 0,
"react/jsx-no-undef": 1,
"react/jsx-pascal-case": 1,
"react/jsx-sort-prop-types": 0,
"react/jsx-sort-props": 0,
"react/jsx-uses-react": 1,
"react/jsx-uses-vars": 1,
"react/no-danger": 1,
"react/no-did-mount-set-state": 1,
"react/no-did-update-set-state": 1,
"react/no-direct-mutation-state": 1,
"react/no-multi-comp": 1,
"react/no-set-state": 0,
"react/no-unknown-property": 1,
"react/prefer-es6-class": 1,
"react/prop-types": 1,
"react/react-in-jsx-scope": 1,
"react/require-extension": 1,
"react/self-closing-comp": 1,
"react/sort-comp": 1,
"react/wrap-multilines": 1
},
"globals": {
}
}
錯誤消息：
Parse errors in imported module './Store.js': Unexpected character '@' (4:2) import/namespace
您能否包含導致錯誤的代碼？你的'.babelrc'看起來正確。你也可以嘗試改變'「es2015」'和'「react」'的順序。 – Tholle
@Tholle，謝謝你的回覆。我添加了發出錯誤的代碼。順便說一句，我也嘗試了重新安排'es2015'＆'react'的順序的建議，但它仍然不適用於我。 –
沒問題。愚蠢的問題：您的文件名爲'.babelrc'或'babelrc'？ – Tholle