你好,我尝试在其他问题中搜索,但没有一个提到的解决方案,我尝试对我不起作用。
使用命令时:
npm启动
我有一个错误:
/src/index.js模块生成失败(来自./node_modules/babel-loader/lib/index.js):语法错误:d:/kodilla/projekty/webpack-to-do-app/src/index.js:意外>令牌(6:4)5 reactdom.render(6
package.json中定义的命令:
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "webpack"
},
index.js文件:
import React from 'react';
import ReactDOM from 'react-dom';
import App from './containers/App';
ReactDOM.render(
<App />,
document.getElementById('app')
);
app.js文件:
import React from 'react';
import uuid from 'uuid';
import style from './App.css';
class App extends React.Component {
constructor(props){
super(props);
this.state = {
data: []
};
}
addTodo(val){
const todo = {
text: val,
id: uuid.v4(),
};
const data = [...this.state.data, todo];
this.setState({data});
}
removeTodo(id) {
const remainder = this.state.data.filter(todo => todo.id !== id);
this.setState({data: remainder});
}
render() {
return (
<div className={style.TodoApp}>
Tutaj pojawią się komponenty naszej aplikacji.
</div>
);
}
}
export default App;
webpack.config.js文件:
const path = require('path');
module.exports = {
entry: './src/index.js',
output: {
path: path.resolve(__dirname, 'build'),
filename: 'app.bundle.js'
},
module: {
rules: [
{
test: /\.js$/,
loader: "babel-loader"
},
{
test: /\.css$/,
use: [
{ loader: 'style-loader'},
{
loader: 'css-loader',
options: {
modules: true
}
}
]
}
]
}
};
.babelrc文件:
{
"presets": [
["env", "react"]
]
}
链接到存储库
编辑:我试过从你建议我复制的帖子的解决方案,但复制1:1对我不起作用。我将webpack配置更改为:
module: {
loaders: [...
{
test: /\.(js|jsx)?$/,
loader: 'babel-loader',
query: {
presets: ['es2015', 'react']
}
}]
},
而问题仍然会发生。我想我可能在其他地方做错了什么而不是在提到的例子。
编辑2:
>
NPM安装Babel-预置-...--保存-开发。
“预设”:[“反应”、“ES2015”、“Stage-0”]
找不到相对于目录“...webpack-to-do-app\node_modules\css-loader”的预置“@babel/preset-env”
我还做错了什么?
问题解决了。
帮助的事情:1。从babel-env,babel-react更新到@babel/preset-env和@babel/preset-react。@babel-core已安装,但babel-core仍在原地。最终设置:
"devDependencies": { "@babel/core": "^7.2.2", "@babel/preset-env": "^7.2.3", "@babel/preset-react": "^7.0.0", "babel": "^6.23.0", "babel-core": "^6.26.3", "babel-loader": "^8.0.4", "css-loader": "^2.1.0", "react": "^16.7.0", "react-dom": "^16.7.0", "style-loader": "^0.23.1", "webpack": "^4.28.2", "webpack-cli": "^3.1.2" },
2.卸载并安装babel-loader,这导致了需要错误版本的babel本身的问题。@Alireza你的建议有一部分是对的。感谢你的帮助.
请考虑在您的.babelrc上设置以下配置
{
"presets": ["react", "es2015", "stage-0"]
}
应该管用。我还看到你在“预置”里面有嵌套数组。每个预置都应该是预置元素之一。
我强烈建议您使用最新的巴别塔(版本7)。当您升级到Babel7时,应该下载@babel/preset-react
和@babel/preset-env
,这就足够了。而.Babelrc将会是这样的:
{
"presets": [
"@babel/react",
"@babel/env"
]
}
我在我的ReactJS应用程序上得到一个意外的令牌。但是我相信语法是正确的。 ./src/组件/身份验证/索引中的错误.js模块生成失败: 语法错误: 意外的标记 (11:11) 我错过了什么? 这是我的webpack.config.js 。巴伯尔克
我正在尝试开始在ReactJS中创建一个站点。然而,当我试图将我的JS放在一个单独的文件中时,我开始遇到这样的错误:“uncaughtSyntaxerror:uncontractedtoken” 我尝试添加添加到JS文件的顶部,但它没有修复任何问题。下面是HTML和JS文件。有没有关于出了什么问题的想法? HTML JS 编辑:我意识到我需要将添加到包含着陆器代码的脚本标记中。然而,在添加这个并重
我在测试机智。ai与fb提供的样品,我运行在以下错误。。。 我对节点和机智很陌生。我使用了初始化并安装节点wit模块。能找个人帮忙吗?
问题内容: 我正在尝试开始在ReactJS中构建网站。但是,当我尝试将JS放在单独的文件中时,我开始收到此错误:“ Uncaught SyntaxError:Unexpected token <”。 我尝试添加到JS文件的顶部,但没有解决任何问题。以下是HTML和JS文件。关于出什么问题有什么想法吗? 的HTML JS 编辑:我意识到我需要添加到包括我的着陆器代码的脚本标签。但是,添加并重新加载后
问题内容: 我正在尝试开始在ReactJS中构建网站。但是,当我尝试将JS放在单独的文件中时,我开始收到此错误:“ Uncaught SyntaxError:Unexpected token <”。 我尝试添加到JS文件的顶部,但没有解决任何问题。以下是HTML和JS文件。关于出什么问题有什么想法吗? HTML JS 编辑:我意识到我需要添加到包括我的着陆器代码的脚本标签。但是,添加并重新加载后,
问题内容: 我刚刚在计算机上安装了MySQL,当我尝试从MySQL Shell创建数据库时,出现此错误: 有人知道为什么会这样吗?MySQL的安装有问题吗? 问题答案: 通过在这里查看该线程,您似乎可以在js模式下使用shell,您可以通过使用switch来将其关闭 https://forums.mysql.com/read.php?10,661192,661203#msg-661203