我的Web开发主要是使用NodeJS的嵌入式设备的Intranet网站和Web前端。
我当前的结构是将所有内容打包在一个NPM软件包中。我在Nginx后面运行NodeJS,并让Nginx直接从public
提供css / image / client-side-javascript文件。
我开始使用VueJS和Vuelidate,两者都使用现在的ES6模块系统-例如import { required, minLength } from 'vuelidate/lib/validators'
。
虽然我(以hackerly的方式)使用当前结构进行了这些工作,但我认为现在是进入Javascript构建系统/捆绑程序领域的时候了。
如果我使用VueJS的WebPack首选选项,应该如何更改代码的结构?
我应该为前端使用一个NPM软件包(由vue-cli init
生成),为Express后端应用使用另一个NPM软件包吗?
我应该将Express App放入生成的Vue前端程序包中吗?
我应该使用browserify
来完成WebPack的工作并保持我现有的结构吗?
还是其他东西?
答案 0 :(得分:1)
我不确定您为什么打算将JavaScript代码放入其他软件包中。如果您有应用程序,则可以将原始JavaScript文件以及构建脚本保存在其中。有人应该能够签出您的应用程序并能够对其进行构建。
如果您想开始使用构建系统,那么一个不错的“桥梁”可能是使用Mix,这是Laravel创建的用于构建前端资产(例如Sass和JavaScript)的项目。它在后台使用Webpack,但反过来又公开了一个更加用户友好,流畅的API。
如果沿着这条路线走,则可以将原始JavaScript文件放在 lib / 或 src / 目录中。然后,您可以使用Mix像这样编译这些组件:
mix.js('lib/your-entry-point-script.js', 'public/js/app.js');
您的入口点脚本只是require
包含所有其他脚本和组件的脚本,以及您要“构建”的脚本。然后,Mix将对其进行编译,并将生成的脚本放在 public / js / app.js 。
Mix本身只是一个npm软件包,因此您所要做的就是npm install laravel-mix --save-dev
。