用于生产的 Vue.js webpack 导出代码

Question

这是我第一次使用前端构建工具。在过去，我从未使用过任何类型的框架，它比在我的 html 页面顶部添加一个<script> 标记更复杂。现在你知道我的知识水平了。

我有一个 vue.js/vuetify 应用程序，其目录结构如下：

我认为它始于 vuetify/webpack 高级模板。 我正在尝试将项目导出到我可以放到网上的东西。我脑子里想，我可以以某种方式运行某种类型的命令，将我的所有代码生成为 .html、.css 和 .js 文件，然后我可以连接到我想要的任何类型的后端。

如果我的假设是正确的，事情就是这样完成的，那么路由是如何处理的？整个网站是否仅在一个 html 文件中？

我认为 webpack 应该这样做吗？但是，当我尝试从命令行运行webpack 时，I get command not found。

如果我的假设是错误的，那我该如何上网呢？

Answer 1

使用npm run build 命令。您可以看到该命令在 package.json 文件、脚本对象中的作用。

 "scripts": {
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
 }

您的整个站点将被编译成index.html 文件和位于/dist 文件夹中的build.js 文件。 /dist 文件夹和build.js 都是在您运行npm run build 命令时生成的。确保index.html 内的脚本src 指向您的build.js 文件。