我正在使用Webpack构建一个Vue.js项目。我想要在项目中添加vue-cli的功能,以便像使用"vue-cli generate project"一样使用它。但我不知道如何将vue-cli集成到现有项目中。
对于新项目,我可以运行vue create <project-name>
,但我找不到将其与现有项目集成的指导说明。是否有官方的方法来实现这个功能呢?(我想我可以创建一个新项目并将所有源文件移动到那里,但肯定还有更好的方法)
我正在使用Webpack构建一个Vue.js项目。我想要在项目中添加vue-cli的功能,以便像使用"vue-cli generate project"一样使用它。但我不知道如何将vue-cli集成到现有项目中。
对于新项目,我可以运行vue create <project-name>
,但我找不到将其与现有项目集成的指导说明。是否有官方的方法来实现这个功能呢?(我想我可以创建一个新项目并将所有源文件移动到那里,但肯定还有更好的方法)
vue create .
。使用终端,在项目文件夹中运行以下命令:
npx @vue/cli create .
我以一种“痛苦”的方式来完成它——创建了一个新项目并与我的现有项目进行比较。我说痛苦是因为我直接在index页面中使用了Bootstrap,并且使用了PWA设置。我使用Parcel作为打包工具,我的文件夹都在根目录下(assets、components等)。
不过,这并没有那么糟糕。我为使过渡更容易所做的事情:
vue create .
创建 vue 项目后,您可以使用以下代码像 vue 本身一样添加应用程序:<!DOCTYPE html>
<html lang=en>
<head>
<meta charset=utf-8>
<meta http-equiv=X-UA-Compatible content="IE=edge">
<meta name=viewport content="width=device-width,initial-scale=1">
<link rel=icon href=/favicon.ico>
<title>planer-demo</title>
<!-- STYLES AND SCRIPTS NEEDED FOR THE APP -->
<link href=/css/app.e1774689.css rel=preload as=style>
<link href=/js/app.ccdcf352.js rel=preload as=script>
<link href=/js/chunk-vendors.d84bf368.js rel=preload as=script>
<link href=/css/app.e1774689.css rel=stylesheet>
</head>
<body>
<noscript>
<strong>We're sorry but planer-demo doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<!-- WHERE WE'LL LOAD THE APP -->
<div id=app></div>
<!-- SCRIPTS NEEDED FOR THE APP -->
<script src=/js/chunk-vendors.d84bf368.js></script>
<script src=/js/app.ccdcf352.js></script>
</body>
</html>
所以,我找到了一个对我有效的更简单的解决方案。我正在使用Windows操作系统和WebStorm。
首先,使用我的Windows文件浏览器,我将所有文件移动到我想要的目录/文件夹中,并通过简单的剪切/复制和粘贴命名为我喜欢的应用程序名称。
接下来,我打开我的IDE(WebStorm),选择打开一个项目并选择新的目录/文件夹。在我的顶级文件夹中,我打开终端并输入: npx @vue/cli create --merge <您的目录/文件夹名称,也就是应用程序名称> 然后按ENTER键。
如果目录名称已经存在,则将CLI合并到此目录中。如果没有,则创建一个新目录并命名为新的应用程序名称。
最后,按照剩余的安装提示进行选择版本。
要启动开发服务器,请选择您的子目录或文件夹(在您新合并的应用程序下),打开终端,cd到文件夹路径(如果需要),输入命令:npm run serve并按ENTER键。这将启动并编译开发服务器,并为您的应用程序提供本地和网络地址。
我的文件结构如下:
希望这能避免一些麻烦。
sudo vue create .
确保你在项目目录中
sudo
不太好--这意味着你正在以 root
身份而不是自己的用户身份安装东西,这可能不是你想要的。 - awwaiid