我目前正在尝试实现本教程:
https://www.typescriptlang.org/docs/handbook/react-&-webpack.html
我应该安装react
和react-dom
,还有webpack
+typescript
+awesome-typescript-loader
+source-map-loader
,我就是这么做的。我还根据从命令行得到的指示安装了webpack-cli
。
我在本地安装了它们(react
和react-dom
作为PROD,其余作为DEV依赖项(。目前我没有在全局安装任何软件包。
在这之后,这就是我的package.json
文件:
{
"name": "reactandwebpack-tutorial",
"version": "1.0.0",
"description": "",
"main": "webpack.config.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"awesome-typescript-loader": "^5.2.0",
"source-map-loader": "^0.2.3",
"typescript": "^2.7.2",
"webpack": "^4.16.4",
"webpack-cli": "^3.1.0"
},
"dependencies": {
"@types/react": "^16.4.7",
"@types/react-dom": "^16.0.6",
"react": "^16.4.2",
"react-dom": "^16.4.2"
}
}
在这一点上,当我运行npm ls
时,我得到了一堆错误,因为webpack的一些可选依赖项显然丢失了(树中的所有错误都在webpack
内部和fsevents
以下,如下所示(:
webpack@4.16.4
(...)watchpack@1.6.0
(...)chokidar@2.0.4
(...)fsevents@1.2.4 -> UNMET OPTIONAL DEPENDENCY
And everything below fsevents is also marked with UNMET DEPENDENCY
当我运行webpack
命令时,我会得到一个"webpack未识别错误"。
有人能帮忙吗?一段时间以来,我一直在努力思考这个问题。
PS:
Npm -v 5.6.0
Node -v 8.11.3 //(that's what I get from the terminal,
//VSCode "About" tells me something different, I don't know why).
Using Visual Code
Version 1.24.0
Date 2018-06-06T17:35:40.560Z
Shell 1.7.12
Renderer 58.0.3029.110
Node 7.9.0
Architecture x64
原因是它没有链接到您的env。当你在全局范围内安装某个东西时,你可以在任何地方访问它,因此它只需执行webpack
即可工作。由于您在本地安装了所有内容,因此二进制文件位于node_modules/.bin
中。
当您在本地安装某个东西时,您有两个选项。
- 使用npm脚本(npm运行构建,观察……不管怎样(
./node_modules/.bin/moduleName --flags
创建一个npm脚本并在那里添加所有命令更容易。
已解决
不确定是什么原因,但这和/带有webpackcli"ambient variable"的bin文件夹不可用(我不知道这是最准确的描述(。
当我尝试运行webpack
时,我会得到"无法识别的错误"。
但当我运行nodemodules.binwebpack-cli
时,它可以正常工作。
所有东西都是本地安装的。
我也可以用选项运行它,比如nodemodules.binwebpack-cli --help
如果运行"webpack",CLI将找到由(npm-install-webpack-g(安装的全局webpack。使用本地项目中的webpack。您应该将其转换为npm脚本。
软件包.json
{
"script": {
"start": "webpack"
}
}
通过这样做,您可以运行npm-start来运行webpack。