1、此处说的本地运行是直接在浏览器上打开项目的入口文件,浏览器的url显示为下图所示
2、报错了,项目中有调取本地json的接口,有静态资源的图片,
3、报错是因为我们不应该直接双击入口文件在浏览器中运行,而是应该在服务器上运行,也就是说url应该是localhost或者http形式开头的,但是我们前端如果只是写个demo,又没有服务器咋办呢?别急,往下看。。。
4、从本地文件夹中直接打开的一般都是file
协议,当代码中存在http
或https
的链接时,HTML页面就无法正常打开,为了解决这种情况,需要在在本地开启一个本地的服务器。
本文是利用node.js
中的http-server
,开启本地服务,步骤如下:
1)下载node.js 官网地址: nodejs.org
下载完成后在命令行输入命令$ node -v
以及$ npm -v
检查版本,确认是否安装成功。
2)下载http-server,执行以下命令
npm install http-server -g
3)开启http-server服务
终端进入目标文件夹,然后在终端输入:http-server -c-1 (⚠️只输入http-server的话,更新了代码后,页面不会同步更新)
页面的url变成了如下图,打开开发者工具,不报错了
此处需要着重说明的是,页面的域名和环境域名要一致,此处用的是测试环境的域名
4)关闭服务
按快捷键CTRL-C