仅使用gulp或webpack构建此节点项目 [英] Build this node project using only gulp or webpack

问题描述

我的项目有这个文件夹结构：

 节点
 | .gitignore 
 | gulpfile.js 
 | package.json 
 | tsconfig.json 
 | webpack.config.js 
 | 
 + ---建立
 | | debug.js 
 | | main.js 
 | | 
 | + ---客户
 | | + ---脚本
 | | | bundle.js 
 | | | 
 | | \ --- views 
 | | index.html 
 | | 
 | | 
 | \ ---服务器
 | | constants.js 
 | | server.js 
 | | 
 | \ ---路由器
 | | constants.js 
 | | router.js 
 | | 
 | \ ---路线
 | base.js 
 | index.js 
 | 
 + --- gulp 
 | | constants.js 
 | | 
 | \ ---任务
 | default.js 
 | html.js 
 | typescript.js 
 | 
 \ --- src 
 | main.ts 
 | 
 + ---客户
 | + --- app 
 | | | app.tsx 
 | | | 
 | | \ ---组件
 | | hello.tsx 
 | | 
 | \ --- views 
 | index.html 
 | 
 \ ---服务器
 | constants.ts 
 | server.ts 
 | 
 \ ---路由器
 | constants.ts 
 | router.ts 
 | 
 \ ---路线
 base.ts 
 index.ts 
  

Gulp用于复制HTML并在 build 文件夹中维护文件夹结构中编译TypeScript。但是我没有找到如何捆绑前端代码和节点依赖关系，以便在 build / client 中生成这些代码。经过一些建议和研究之后，我使用Webpack创建了 bundle.js 。

现在我有了预期的结果，但我想知道是否有一种方法只有Gulp或Webpack，才能简化构建过程。 解决方案

我想知道是否只有Gulp或Webpack的方法

这些是不同的工具。

• 吞下：任务跑步者。运行代码段


• Webpack：Module bundler。以可在浏览器中使用的方式捆绑代码。

如果你想要一个捆绑器（你这样做） gulp是不够的。

My project has this folder structure:

node
|   .gitignore
|   gulpfile.js
|   package.json
|   tsconfig.json
|   webpack.config.js
|   
+---build
|   |   debug.js
|   |   main.js
|   |   
|   +---client
|   |   +---scripts
|   |   |       bundle.js
|   |   |       
|   |   \---views
|   |           index.html
|   |           
|   |               
|   \---server
|       |   constants.js
|       |   server.js
|       |   
|       \---router
|           |   constants.js
|           |   router.js
|           |   
|           \---routes
|                   base.js
|                   index.js
|                   
+---gulp
|   |   constants.js
|   |   
|   \---tasks
|           default.js
|           html.js
|           typescript.js
|           
\---src
    |   main.ts
    |   
    +---client
    |   +---app
    |   |   |   app.tsx
    |   |   |   
    |   |   \---components
    |   |           hello.tsx
    |   |           
    |   \---views
    |           index.html
    |               
    \---server
        |   constants.ts
        |   server.ts
        |   
        \---router
            |   constants.ts
            |   router.ts
            |   
            \---routes
                    base.ts
                    index.ts

Gulp is used to copy HTML and compile TypeScript in build folder maintaining folder structure. But I didn't found how to also bundle front-end code and node dependencies in order to make these avaiable in build/client. After some suggestion and research I used Webpack to create bundle.js.

Now I've the expected result but I wonder if there is a way to only Gulp or Webpack, in order to simplify the build process.

解决方案

I wonder if there is a way to only Gulp or Webpack

These are different tools.

• Gulp: Task runners. Runs code segments
• Webpack: Module bundler. Bundles code in a manner that can be used in the browser.

If you want a bundler (which you do) gulp will not suffice.

这篇关于仅使用gulp或webpack构建此节点项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！