node.js - 试图让一个无头 WordPress 在纱线启动命令上进行热重载
问题描述
我正在运行这个项目https://github.com/postlight/headless-wp-starter。我已经能够让一切工作达到一定程度。后端工作正常,但是前端有一个错误。
在说明中说运行yarn start
以启动前端服务器,它应该是next.js
. 现在这在技术上工作正常,它运行在localhost:3000
. 但是,当我在 中修改scss
文件时frontend/src/styles
,它不会在 shell 中重新呈现,并且浏览器中也没有热重新加载,即使点击刷新也不会显示样式更改。但是,如果我停止使用纱线,ctrl + c
然后再次运行它,yarn start
我的样式会在浏览器刷新时显示。
我在 docker for windows 下运行所有东西,所以不知道这是否是一个限制,或者可能是一个错误。我在他们的 github 上发布了一个问题,但认为在这里检查也没有什么坏处。
我能想到的唯一共享代码就是package.json
这里。提前谢谢。
{
"name": "frontend",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "next build",
"start": "node server.js",
"docker:build": "docker build -t frontend .",
"docker:clean": "docker rm -f frontend || true",
"docker:run": "docker run -p 3000:3000 --name frontend frontend",
"docker:stop": "docker stop frontend",
"docker:start": "docker start frontend && yarn run docker:logs",
"docker:logs": "docker logs -f frontend",
"deploy":
"yarn run docker:build && yarn run docker:clean && yarn run docker:run"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.16.2",
"isomorphic-unfetch": "^2.0.0",
"next": "latest",
"react": "^16.0.0"
},
"devDependencies": {
"autoprefixer": "7.1.5",
"babel-plugin-module-resolver": "^2.7.1",
"babel-plugin-wrap-in-js": "^1.1.0",
"glob": "^7.1.2",
"node-sass": "^4.4.0",
"normalize.css": "^7.0.0",
"postcss-easy-import": "^3.0.0",
"postcss-loader": "^2.0.7",
"raw-loader": "^0.5.1",
"react-dom": "^16.2.0",
"sass-loader": "^6.0.6",
"webpack": "^3.10.0"
}
}
更新:由于似乎热重载是windows的问题,我的主要问题是是否有办法运行不热重载的任务,我可以自己刷新浏览器,否则我无法开发在 Windows 上,无需停止并重新启动服务,每次更改,这将是不可能做任何事情的。
解决方案
值得尝试的事情是像往常一样使用前端堆栈(nodejs、yarn 等),而不在 docker 容器中使用它。按着这些次序:
后端服务
- 禁用文件中的端口
3000
,docker-compose.yml
您可以删除该- "3000:3000"
行或更改它。因为这个端口将被yarn
你在 docker 容器之外运行的端口使用。如果不更改也不删除会导致端口冲突。- 从项目的根目录运行:
docker-compose up -d
启动 docker 服务,- 使用确认该端口
3000
是空闲的docker ps
,- 输入 bash 到 docker 容器
docker exec -it wp-headless /bin/bash
,然后运行yarn install
. 仅在首次设置时运行此步骤一次。实际上yarn install
这里的命令与反应前端无关。它只是为 wordpress 和后端依赖项进行设置。所有安装完成后退出容器。
前端服务
- 您应该已经在您的计算机中安装了所有必需的前端工具(nodejs、yarn 等)。
- 将工作目录更改为前端:
cd frontend
,- 安装前端包依赖:
yarn install
,- 启动前端开发服务:
yarn start
,- 现在您的前端工作流堆栈将正常运行(没有 docker)。请记住,
yarn
您现在将使用的是在 docker 容器之外并且是完全分离的东西。
希望能帮助到你。