我有一个Vue Cli 3应用程序,该应用程序在构建时会在“ dist”目录中创建一组Web组件。
我正在寻找一种在运行时能够浏览“ dist”目录中的文件的方法npm run serve
,这将启动webpack开发服务器。
现在,当我执行此操作时(例如,浏览到http:// localhost:8083 / dist / component.js之类的东西),便会看到在公共目录中找到的index.html文件。
如何通过vue.config.js文件配置使devserver服务“ dist”目录中的文件的能力?
devServer
旨在为开发环境提供配置以应用某些加载程序,插件等。您正在寻找的是一种将本地托管文件作为工作应用程序提供的方法。这是两个不同的目的,我不建议devServer
为此目的调整配置。
有一些简单的方法可以在本地计算机上提供静态文件。最简单的方法之一是使用实时服务器,服务或类似服务器。
为了使其live-server
仅需几个步骤即可工作:
1)安装
npm install -g live-server
2)在终端中,导航到静态文件所在的文件夹(例如 project-folder/dist/
3)运行live-server
命令。
这将打开一个浏览器选项卡index.html
作为入口,并在本地计算机上模拟Web服务器。docs中还有更多可用选项。
但这将达到目的,不会干扰devServer
目的。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句