成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

spring-boot 和 webpack-dev-server聯(lián)合開發(fā)

Dean / 610人閱讀

摘要：當(dāng)前前后端架構(gòu)分離的模式比較流行，前端用或者等方式發(fā)布與渲染網(wǎng)頁，后端程序只提供的數(shù)據(jù)接口。但是與結(jié)合起來就不太協(xié)調(diào)。這時候就可以用到的代理模式了。在中添加之后直接啟動程序，然后就可以通過訪問端口來進(jìn)行前端的熱開發(fā)了

當(dāng)前前后端架構(gòu)分離的模式比較流行，前端用Nodejs或者ngnix等方式發(fā)布與渲染網(wǎng)頁，后端程序只提供restful的數(shù)據(jù)接口。但對于一些小項(xiàng)目來說，并不想讓前后端如此分離，還是希望用spring-boot的內(nèi)置tomcat來serve static content。

如果只是用前端工具的話，webpack是一個很好的打包方式，webpack-dev-server給我們提供了很好的在線調(diào)試與修改。但是與spring-boot結(jié)合起來就不太協(xié)調(diào)。這時候就可以用到webpack-dev-server的代理模式了。通過webpack-dev-server來代理spring-boot中tomcat的端口（默認(rèn)8080）

這里貼出我的一個配置文件

// webpack.config.js

var path = require("path");
var webpack = require("webpack");
var HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    devtool: "source-map",
    entry: [
        "webpack-dev-server/client?http://localhost:3000",
        "webpack/hot/only-dev-server",
        "./src/main/web/index.js"
    ],
    output: {
        path: "./src/main/resources/static",
        filename: "index.js",
        publicPath: "http://localhost:3000/"
    },
    module: {
        loaders: [
            {test: /.css$/, loader: "style!css"},
            {
                test: /.js$/, loader: "babel-loader",
                exclude: /node_modules/,
                query: {
                    presets: ["es2015"]
                }
            },
            { test: /.(png|jpg|jpeg|gif|woff)$/, loader: "url-loader?limit=8192" },
            { test: /.html$/, loader: "html"},
        ]
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoErrorsPlugin(),
        new HtmlWebpackPlugin({
        template: "./src/main/web/index.tmpl"
    })],
    devServer: {
        port: 3000,
        proxy: {
            "**": {
                target: "http://localhost:8080",
                secure: false,
                prependPath: false
            }
        },
        publicPath: "http://localhost:3000/",
        historyApiFallback: true
    }
};

在這里我們可以看到，通過webpack-dev-server的3000端口去代理8080端口。在package.json中添加

  "scripts": {
    "webpack": "webpack",
    "watch": "webpack-dev-server --inline"
  },

之后直接啟動spring boot程序，然后npm run watch就可以通過訪問3000端口來進(jìn)行前端的熱開發(fā)了

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/80546.html

相關(guān)文章

  • SpringBoot 入門簡介

    摘要：這里使用的是數(shù)據(jù)庫啟動類上加上注解在啟動類中添加對包掃描掃描多個包下的可以有以下幾種方法掃描會自動加載相關(guān)配置，數(shù)據(jù)源就會自動注入到中，會自動注入到中，可以直接使用。有配置文件下的使用掃描多個包下的可以有以下幾種方法掃描 Spring-Boot 學(xué)習(xí)筆記 1 Spring-Boot 介紹 1.1 什么是Spring-Boot Spring-Boot是由Pivotal團(tuán)隊(duì)提供的全新框架...

    chuyao 評論0 收藏0

  • SpringBoot熱部署加持

    摘要：概述進(jìn)行的開發(fā)過程中，我們很多時候經(jīng)常需要重啟服務(wù)器才能保證修改的源代碼文件或者一些諸如的配置文件以及一些靜態(tài)文件生效，這樣耗時又低效。 showImg(https://segmentfault.com/img/remote/1460000015363888); 概述 進(jìn)行SpringBoot的Web開發(fā)過程中，我們很多時候經(jīng)常需要重啟Web服務(wù)器才能保證修改的 源代碼文件、或者一些...

    ixlei 評論0 收藏0

  • Spring Boot （一）helloworld

    摘要：第二個類級別注解是。將引導(dǎo)應(yīng)用程序，啟動，從而啟動自動配置服務(wù)器。比如想使用不同版本的，具體如下在標(biāo)簽中還可以指定編譯的版本和項(xiàng)目的編碼格式指定項(xiàng)目編碼為使用插件可以為項(xiàng)目提供的操作方式，的個，默認(rèn)。 引言 Spring 框架對于很多 Java 開發(fā)人員來說都不陌生。Spring 框架包含幾十個不同的子項(xiàng)目，涵蓋應(yīng)用開發(fā)的不同方面。如此多的子項(xiàng)目和組件，一方面方便了開發(fā)人員的使用，另外...

    go4it 評論0 收藏0

  • Intellij IDEA 開發(fā) Spring-boot項(xiàng)目 熱部署，自動部署

    摘要：使用開發(fā)項(xiàng)目熱部署，自動部署使用開發(fā)項(xiàng)目，即使項(xiàng)目使用了，修改了類或者等，還是不會自動重啟，非要手動去一下或者重啟，就更沒有使用熱部署一樣。 使用Intellij IDEA 開發(fā) Spring-boot項(xiàng)目 熱部署，自動部署 使用Intellij IDEA 開發(fā) Spring-boot項(xiàng)目，即使項(xiàng)目使用了spring-boot-devtools，修改了類或者h(yuǎn)tml、js等，idea還...

    zengdongbao 評論0 收藏0

  • SpringBoot 1024行代碼 - 系統(tǒng)監(jiān)控工具 Actuator簡介

    摘要：前言在生產(chǎn)環(huán)境中，我們比較關(guān)心任意時刻一個的運(yùn)行情況。調(diào)用接口返回結(jié)果我們猜測這個應(yīng)該是表示應(yīng)用程序正在正常運(yùn)行。調(diào)用接口返回結(jié)果似乎什么都沒發(fā)生，沒關(guān)系，我們繼續(xù)進(jìn)行。我們繼續(xù)試了上文列舉的若干接口，發(fā)現(xiàn)大部分返回結(jié)果都是未授權(quán)。 前言 在生產(chǎn)環(huán)境中，我們比較關(guān)心任意時刻一個JVM的運(yùn)行情況。SpringBoot為我們提供了一個方便的功能模塊Actuator。只要簡單幾步就可以為我們...

    darkerXi 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<