使用 Parceljs 和 React 构建?
building with Parceljs and React?
如何让 Parceljs 与 React 一起工作?我正在使用他们的 repo 中的示例,但它不起作用。
https://github.com/parcel-bundler/examples
在我 运行 'npm start' 之后它可以工作并按预期在本地主机上呈现页面但是当我单击 /dist 中的输出文件时它不会工作。所以当我尝试从 dist/index.html 加载它时,页面只是空白。我还尝试了他们网站上的生产命令,因此它会停止监视文件,但这也会导致 dist 文件夹加载空白页。
我该怎么做?任何帮助都会很棒。本质上,我希望能够在没有本地主机的情况下访问捆绑文件。
谢谢。
您 运行 在本地创建索引文件,index.html 期望 css 文件和 js 文件位于根目录。当您在本地打开文件时,它试图在 C://
下找到
要解决这个问题,您必须在编译后编辑 index.html。以下是解决问题的三种方法,方法三侧重于解决您的问题,但我推荐方法一和方法二。
方法一
- 通过 运行ning
npm install -g http-server
安装 http-server
- 通过终端/cmd 转到您的项目 dist 文件夹
- 输入 http-server
- 您的项目将在您的默认网络浏览器中打开
方法二
- 将您的应用程序上传到网络服务器
- 您的申请应该运行
方法三(不推荐)
- 添加 NPM 脚本
"production": "parcel build index.html"
- 运行 production build 通过 cd 到你的项目并输入
npm run production
- 进入您的 dist 文件夹并在编辑器中打开 index.html
- 将 css 文件路径从
href="/main.--------.css"
修改为 href="./main.--------.css">
- 将js文件路径由
src="/main.--------.js"
修改为href="./main.--------.js">
(注意:React 插件在本地打开时不会检测到 React,但应用程序可以正常运行。)
如何让 Parceljs 与 React 一起工作?我正在使用他们的 repo 中的示例,但它不起作用。
https://github.com/parcel-bundler/examples
在我 运行 'npm start' 之后它可以工作并按预期在本地主机上呈现页面但是当我单击 /dist 中的输出文件时它不会工作。所以当我尝试从 dist/index.html 加载它时,页面只是空白。我还尝试了他们网站上的生产命令,因此它会停止监视文件,但这也会导致 dist 文件夹加载空白页。
我该怎么做?任何帮助都会很棒。本质上,我希望能够在没有本地主机的情况下访问捆绑文件。
谢谢。
您 运行 在本地创建索引文件,index.html 期望 css 文件和 js 文件位于根目录。当您在本地打开文件时,它试图在 C://
要解决这个问题,您必须在编译后编辑 index.html。以下是解决问题的三种方法,方法三侧重于解决您的问题,但我推荐方法一和方法二。
方法一
- 通过 运行ning
npm install -g http-server
安装 http-server
- 通过终端/cmd 转到您的项目 dist 文件夹
- 输入 http-server
- 您的项目将在您的默认网络浏览器中打开
方法二
- 将您的应用程序上传到网络服务器
- 您的申请应该运行
方法三(不推荐)
- 添加 NPM 脚本
"production": "parcel build index.html"
- 运行 production build 通过 cd 到你的项目并输入
npm run production
- 进入您的 dist 文件夹并在编辑器中打开 index.html
- 将 css 文件路径从
href="/main.--------.css"
修改为href="./main.--------.css">
- 将js文件路径由
src="/main.--------.js"
修改为href="./main.--------.js">
(注意:React 插件在本地打开时不会检测到 React,但应用程序可以正常运行。)