使用Vue开发应用程序后该怎么办vue-cli
?
在Angular中,有一些命令将所有脚本捆绑到一个脚本中,然后将这些文件发送到主机。
Vue是否有相同的东西?
使用Vue开发应用程序后该怎么办vue-cli
?
在Angular中,有一些命令将所有脚本捆绑到一个脚本中,然后将这些文件发送到主机。
Vue是否有相同的东西?
Answers:
我认为您已经创建了这样的项目:
vue init webpack myproject
好了,现在您可以运行
npm run build
将index.html和/ dist /文件夹复制到您的网站根目录中。做完了
npm start
或类似的东西吗?
vue init webpack myproject
您一起创建了项目)将在控制台中看到更多说明:cd myproject
,npm install
。在npm install
下载所有软件包之后,vue可以npm run dev
用于开发服务器+热重载,也可以npm run build
用于创建可部署的捆绑包进行编译。
dist
文件夹是你所需要的。你并不需要复制/index.html
,但只有index.html
在在dist
文件夹中是必要的。另外,在运行之前npm run build
,你应该在配置您的生产路径config/index.js
”。
如果您使用以下方法创建了项目:
vue init webpack myproject
您需要将其设置NODE_ENV
为生产并运行,因为该项目已为开发和生产配置了Web Pack:
NODE_ENV=production npm run build
将dist/
目录复制到您的网站根目录中。
如果要使用Docker进行部署,则需要一个提供dist/
目录的Express服务器。
Docker文件
FROM node:carbon
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
ADD . /usr/src/app
RUN npm install
ENV NODE_ENV=production
RUN npm run build
# Remove unused directories
RUN rm -rf ./src
RUN rm -rf ./build
# Port to expose
EXPOSE 8080
CMD [ "npm", "start" ]
如果遇到与你的路径问题,也许你需要改变assetPublicPath
你的config/index.js
文件到您的子目录:
该命令用于启动开发服务器:
npm run dev
此命令用于生产版本:
npm run build
确保查看并进入生成的名为“ dist”的文件夹。
然后开始将所有这些文件推送到您的服务器。
我认为您可以使用vue-cli
如果您使用Vue CLI以及在其部署过程中处理静态资产的后端框架,那么您要做的就是确保Vue CLI在正确的位置生成生成的文件,然后按照后端框架的部署说明进行操作。
如果您要与后端分开开发前端应用程序-即后端公开了一个供您与前端设备对话的API,则您的前端实质上是一个纯静态的应用程序。您可以将dist目录中的构建内容部署到任何静态文件服务器,但是请确保设置正确的baseUrl
npm run build-这将使代码丑陋并最小化
将index.html和dist文件夹保存在您网站的根目录中。
您可能感兴趣的免费托管服务-Firebase托管。
如果在创建项目时使用了vue-cli和webpack。
你可以用
npm在命令行中运行build命令,它将在您的项目中创建dist文件夹。只需将该文件夹的内容上传到您的ftp并完成。
这是为了部署到自定义文件夹(如果您不希望您的应用程序不是root用户,例如URL / myApp /)-我花了很长时间才能找到这个答案...希望它可以对某人有所帮助。
在https://cli.vuejs.org/guide/上获得VUE CLI并使用UI构建使其变得容易。然后在配置中,您可以将公共路径更改为/ whatever /并链接到URL / whatever。
观看此视频,该视频说明了如何在需要更多帮助的情况下使用CLI创建vue应用程序: https //www.youtube.com/watch?v=Wy9q22isx3U
首先在全球范围内安装Vue Cli
npm install -g @vue/cli
要创建一个新项目,请运行:
vue create project-name
运行提示
npm run serve
Vue CLI> = 3使用相同的vue二进制文件,因此它将覆盖Vue CLI 2(vue-cli)。如果仍然需要传统的vue init功能,则可以安装全局桥:
全球Vue Init
npm install -g @vue/cli-init
Vue创建应用
vue init webpack my-project
运行开发人员服务器
npm run dev
如果您要构建并发送到远程服务器,则可以使用cli-service(https://cli.vuejs.org/guide/cli-service.html),您可以创建服务任务,构建任务以及其中的一些任务特定的插件为vue-cli-plugin-s3-deploy