vscode修改vue3中 npm run serve后默认打开的浏览器为chrome

你可以在 package.json 文件中的 scripts 部分添加一行代码："serve": "vue-cli-service serve --open chrome"，这样就可以默认打开 Chrome 浏览器了。

相关问题

vscode 调试vue的安装包

### 回答1：
要调试Vue.js项目，您需要安装以下插件：

1. Vetur：Vetur是一款专为Vue.js开发者设计的插件，提供了代码高亮、语法检查、Emmet等功能。

2. Debugger for Chrome：Debugger for Chrome是一款用于在Visual Studio Code中调试Chrome浏览器的插件。

要在VSCode中调试Vue.js，请按照以下步骤操作：

1. 安装以上两个插件
2. 在VSCode中打开您的Vue.js项目
3. 点击调试按钮，或按“F5”键启动调试
4. 在Chrome浏览器中打开调试工具（可以使用快捷键“F12”）
5. 在VSCode中设置断点并启动调试

这样，您就可以在VSCode中调试Vue.js项目了。

### 回答2：
要调试Vue应用程序，您需要安装一些必要的软件包。以下是安装和配置VSCode进行Vue调试的步骤：

1.首先，确保您已经安装了VSCode（Visual Studio Code）编辑器。您可以从VSCode官方网站上下载并安装最新版本的软件。

2.在VSCode中，打开“扩展”面板（Ctrl+Shift+X）。在搜索栏中输入“Debugger for Chrome”并安装该扩展。这个扩展将允许您与Chrome浏览器进行调试。

3.安装Vue开发工具。在终端窗口中运行以下命令：`npm install -g @vue/cli`

4.创建一个新的Vue项目。在终端中运行以下命令：`vue create my-project`。根据提示进行配置和选择合适的选项来创建Vue项目。

5.进入您的Vue项目的根目录：`cd my-project`

6.安装必要的依赖项。在终端中运行如下命令：`npm install`

7.启动Vue项目。在终端中运行如下命令：`npm run serve`。此命令将启动开发服务器，并在浏览器中显示您的Vue应用程序。

8.打开VSCode并导航到“调试”面板（Ctrl+Shift+D）。

9.在“调试”面板中，点击“添加配置”按钮，并选择“Chrome”作为调试环境。

10.在VSCode中找到并打开`.vscode/launch.json`文件。如果文件不存在，可以通过创建一个新文件来创建它。

11.在`launch.json`文件中，将以下配置复制并粘贴到`configurations`数组中：

{
  "type": "chrome",
  "request": "launch",
  "name": "Vue Chrome",
  "url": "http://localhost:8080",
  "webRoot": "${workspaceFolder}"
}

12.保存`launch.json`文件。

13.在VSCode中，点击“调试”面板中的绿色播放按钮以启动Vue调试。

现在，您已经成功安装和配置了VSCode以进行Vue调试。您可以在VSCode中设置断点，并使用Chrome浏览器调试您的Vue应用程序。

### 回答3：
要调试Vue项目，你需要安装一些必要的包和插件。首先，确保已经安装了Node.js和npm，因为Vue.js是基于Node.js的。

在安装Vue项目之前，你需要全局安装Vue CLI（命令行工具）。在命令行中输入以下命令进行安装：

npm install -g @vue/cli

安装完成后，通过以下命令检查Vue CLI是否安装成功：

vue --version

接下来，进入你的项目文件夹，在命令行中运行以下命令以创建一个新的Vue项目：

vue create my-project

这将启动一个交互式的安装过程，你可以根据提示进行选择。安装完成后，使用以下命令进入项目文件夹：

cd my-project

在这个文件夹中，你可以通过以下命令启动开发服务器：

npm run serve

现在，你可以使用VS Code打开你的Vue项目文件夹。打开“扩展”视图并搜索“Vue”，安装Vue的相关插件。常用的插件有“Vetur”和“Vue 3 Snippets”。

你还需要安装“Debugger for Chrome”插件，用于在VS Code中调试Vue项目。安装完成后，点击VS Code底部的调试视图，然后在左侧面板中点击齿轮图标以编辑调试配置。选择“Chrome”作为调试工具，然后保存配置。

现在，你可以在VS Code中设置断点并启动调试。通过按下F5键，VS Code将自动在Chrome浏览器中打开你的应用，并在你设置的断点处停止。

通过以上步骤，你已经成功安装并配置了VS Code用于调试Vue项目的必要工具和插件。

vscode启动vue项目crbug/1173575, non-JS module files deprecated.

要解决在VSCode中启动Vue项目时出现"crbug/1173575, non-JS module files deprecated"的问题，可以按照以下步骤进行操作：

1. 首先，确保你的项目结构中没有非JS模块文件。这是因为最新版本的Chrome浏览器对非JS模块文件的支持已经被弃用，所以在启动Vue项目时会出现此警告。你可以检查你的项目文件，将所有非JS模块文件转换为JS模块文件。

2. 如果第一步没有解决问题，你可以尝试在命令行中执行以下命令来启动Vue项目：npm run dev（如果报错缺失dev，则输入npm run serve）。请确保在执行此命令之前已经进入了Vue项目的根目录。这个方法可以通过重新编译和打包项目来解决一些与依赖项或配置相关的问题。

如果以上方法仍然无法解决问题，你可以尝试以下方法：

3. 确保你的VSCode和Vue开发环境都是最新版本。有时，旧版本的软件可能会导致一些兼容性问题。更新软件可以修复一些已知的Bug和问题。

4. 检查你的项目依赖项是否正确安装。可以使用npm install命令来安装项目所需的所有依赖项。确保所有依赖项都已正确安装并且版本与你的项目要求的版本相匹配。

总结一下，对于在VSCode中启动Vue项目时出现"crbug/1173575, non-JS module files deprecated"的问题，你可以通过检查项目文件、执行npm run dev命令或者确保软件和依赖项的版本正确来解决该问题。希望以上方法对你有帮助。

- Vue.js官方文档: https://vuejs.org/
- VSCode官方文档: https://code.visualstudio.com/
- Stack Overflow: https://stackoverflow.com/