如何搭建webpack與SPA開(kāi)發(fā)環(huán)境-創(chuàng)新互聯(lián)

這篇文章主要介紹了如何搭建webpack與SPA開(kāi)發(fā)環(huán)境,具有一定借鑒價(jià)值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。

成都創(chuàng)新互聯(lián)主營(yíng)芙蓉網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,app軟件開(kāi)發(fā)公司,芙蓉h5微信平臺(tái)小程序開(kāi)發(fā)搭建,芙蓉網(wǎng)站營(yíng)銷推廣歡迎芙蓉等地區(qū)企業(yè)咨詢

項(xiàng)目初始化

以你喜歡的任意方式,創(chuàng)建項(xiàng)目根目錄,如:

mkdir vue-hello

初始化包模塊管理文件

進(jìn)入項(xiàng)目根目錄,初始化項(xiàng)目包模塊管理文件package.json:

npm init

命令臺(tái)會(huì)提示你輸入一堆信息,如果你想簡(jiǎn)單一點(diǎn),可以添加-y參數(shù),跳過(guò)輸入步驟,生成默認(rèn)信息:

npm init -y

如何搭建webpack與SPA開(kāi)發(fā)環(huán)境

初始化源碼目錄

在項(xiàng)目根目錄下創(chuàng)建源碼目錄結(jié)構(gòu),通常源碼目錄是src或app,個(gè)人喜好是使用src:

如何搭建webpack與SPA開(kāi)發(fā)環(huán)境

webpack簡(jiǎn)述及使用

雖然在本篇文章我們不會(huì)對(duì)webpack做太過(guò)詳細(xì)的介紹,但是依然希望能幫助讀者對(duì)webpack擁有更清晰的了解,webpack是什么?

webpack is a tool to build JavaScript modules in your application

webpack是一個(gè)幫助你的應(yīng)用構(gòu)建JavaScript模塊的工具。

接下來(lái),我們介紹幾個(gè)知識(shí)點(diǎn)幫助理解webpack:模塊化,webpack原理及其與grunt和gulp的比較。

模塊化

模塊化 指解決一個(gè)復(fù)雜問(wèn)題時(shí)自頂向下逐層把系統(tǒng)劃分成若干模塊的過(guò)程。

模塊是一個(gè)可組合、分解和更換的單元,將一個(gè)系統(tǒng)分解成若干模塊,單元;大家遵循一定的規(guī)范,各司其職,各自開(kāi)發(fā)不同模塊;之后可以較低成本的將模塊組合起來(lái),構(gòu)成一個(gè)完整的系統(tǒng),極大方便了團(tuán)隊(duì)成員之間的協(xié)助開(kāi)發(fā),產(chǎn)出效率得到有效提升。

WEBPACK原理

webpack是一個(gè)幫助你的應(yīng)用構(gòu)建JavaScript模塊的工具,其本質(zhì)只能處理JavaScript,那你會(huì)疑惑了,不是說(shuō)使用webpack,可以很方便的在JavaScript代碼中引用圖片,CSS等資源嘛?是的,這正是webpack的優(yōu)勢(shì),那怎么實(shí)現(xiàn)的呢?這就要涉及到webpack中的一個(gè)概念:加載器(loader)。

加載器 是作用于應(yīng)用資源文件的轉(zhuǎn)換器,它們是一系列JavaScript函數(shù),接受資源文件的內(nèi)容做參數(shù),然后返回新的資源(以一個(gè)JavaScript模塊的形式返回)。

所以,對(duì)于webpack,我們明確三點(diǎn):

  1. 模塊:webpack中一切資源文件(JavaScript, 樣式, 圖片資源等)皆視為模塊;

  2. 加載器:webpack通過(guò)加載器(JavaScript函數(shù))將其他資源處理(構(gòu)建)成JavaScript模塊;

  3. 管理依賴:webpack在編譯模塊時(shí),就能分析查找該模塊內(nèi)的依賴,可以很好的處理不同模塊間的依賴;

WEBPACK對(duì)比GRUNT/GULP

grunt

打開(kāi)grunt官網(wǎng),你可以看到最醒目的介紹:The JavaScript Task Runner,還有一個(gè)關(guān)鍵字automation – 自動(dòng)化,其定位是一個(gè)JavaScript的自動(dòng)化構(gòu)建任務(wù)處理器,幫助開(kāi)發(fā)者自動(dòng)化處理項(xiàng)目的構(gòu)建流程;

gulp

gulp官網(wǎng)的定義是:Automate and enhance your workflow,自動(dòng)強(qiáng)化項(xiàng)目構(gòu)建流程,其與grunt的目標(biāo)一致,都是幫助開(kāi)發(fā)者自動(dòng)化處理項(xiàng)目的構(gòu)建流程,不同的是gulp實(shí)現(xiàn)方式是基于流的,即以流的方式處理文件,而grunt是以二進(jìn)制方式處理文件,gulp使用性能是要強(qiáng)于grunt的;

總結(jié)

  1. webpack定位是一個(gè)模塊化管理工具,而grunt/gulp都是自動(dòng)化任務(wù)流程構(gòu)建工具;

  2. grunt基于二進(jìn)制處理文件,gulp基于流式處理文件,效率比grunt更高一些;

  3. webpack強(qiáng)大特性,使得其添加諸多插件可以替代grunt/gulp,但是目前的實(shí)踐項(xiàng)目中,通常webpack結(jié)合gulp或grunt使用(各自處理各自專長(zhǎng)的任務(wù));

安裝

首先安裝webpack,npm或yarn都可以,無(wú)甚區(qū)別:

npm install --save-dev webpack

關(guān)于此處的--save和-dev參數(shù)做簡(jiǎn)要說(shuō)明:

  1. --save是聲明將安裝依賴添加入package.json文件;

  2. 默認(rèn)地,使用npm安裝包模塊依賴時(shí),依賴關(guān)系存儲(chǔ)在在"dependencies"屬性對(duì)象內(nèi),表示項(xiàng)目依賴;

  3. webpack是作為開(kāi)發(fā)環(huán)境依賴的,不是作為源碼直接調(diào)用,所以添加-dev參數(shù),以聲明其是開(kāi)發(fā)環(huán)境依賴;

webpack配置介紹

實(shí)踐項(xiàng)目使用webpack完成自動(dòng)化構(gòu)建,本地服務(wù)調(diào)試與熱加載,首先在根目錄下創(chuàng)建webpack的配置入口文件webpack.config.js,基本內(nèi)容結(jié)構(gòu)如下:

  var path = require('path');

  module.exports = {
    context: path.resolve(__dirname, 'src/'),
    entry: {
      app: './scripts/app.js'
    },
    output: {
      filename: '[name].js',
      path: path.resolve(__dirname, 'dist/scripts/')
    },
    module: {
      loaders: []
    },
    resolve: {
      modules:[],
      alias: {},
      extensions: []
    },
    plugins: [],
    devServer: {}
  };

如上,webpack配置文件使用module.exports方式導(dǎo)出配置對(duì)象,webpack執(zhí)行時(shí)會(huì)默認(rèn)讀取項(xiàng)目根目錄下webpack.config.js文件,當(dāng)然可以手動(dòng)配置指定一個(gè)文件作為配置文件,我們不討論,可以參考webpack文檔,接下來(lái)對(duì)webpack配置內(nèi)容做簡(jiǎn)要介紹,如果你對(duì)webpack使用比較熟悉,可以跳過(guò)此節(jié)。

文件處理配置

和webpack文件處理相關(guān)的幾個(gè)配置屬性主要有三個(gè):目錄上下文信息(context), 處理文件入口信息(entry), 文件輸出信息(output)。

目錄上下文信息(context)

設(shè)置解析處理文件入口的相對(duì)目錄,值為一個(gè)絕對(duì)目錄路徑,默認(rèn)為當(dāng)前執(zhí)行目錄,通常即項(xiàng)目根目錄,在Node中其值與process.cwd()相同,如:

context: path.resolve(__dirname, 'src/'),

如上即解析為項(xiàng)目根目錄下的src目錄。

處理文件入口信息(entry)

處理文件入口,值可以是字符串,或數(shù)組,或?qū)ο?,值為字符串或?shù)組時(shí),即輸出單文件,值為對(duì)象,可以輸出多文件,輸出文件名稱等信息參考文件輸出信息(output)。

文件輸出信息(output)

此配置聲明webpack編譯輸出文件的文件名等信息,如:

filename: '[name].js',

聲明文件名就是模塊(chunk)名,對(duì)應(yīng)在entry中定義的入口,你可能還見(jiàn)過(guò)[id],[hash],[chunkhash]這些用法,現(xiàn)做簡(jiǎn)單介紹:

  1. [id]:該值表示webpack編譯模塊(chunk)的id,通常是一個(gè)數(shù)字;

  2. [name]:該值表示webpack編譯模塊(chunk)名,對(duì)應(yīng)entry中定義的入口名或文件名;

  3. [chunkhash]:該值表示webpack編譯模塊(chunk)hash值,根據(jù)模塊內(nèi)容計(jì)算出的一個(gè)md5值;

  4. [hash]:該值表示webapck編譯對(duì)象hash值,根據(jù)編譯對(duì)象計(jì)算出的md5值;

編譯對(duì)象,即webpack執(zhí)行時(shí)讀取配置后生成的一個(gè)編譯配置對(duì)象,包含模塊,待編譯文件,相對(duì)于上次編譯的變更文件等諸多信息,需要注意的是該對(duì)象在webpack啟動(dòng)讀取配置文件后形成,在此次編譯過(guò)程保持不變。

  1. output.path:定義輸出文件所在目錄;

  2. output.publicPath:定義輸出文件在瀏覽器訪問(wèn)時(shí)的基礎(chǔ)相對(duì)路徑,可以與后文webpack-dev-server一起使用。

webpack加載器與模塊

在介紹加載器配置之前,先看看加載器是什么:

Loaders are transformations that are applied on a resource file of your app. They are functions (running in node.js) that take the source of a resource file as the parameter and return the new source.

加載器是作用于應(yīng)用資源文件的轉(zhuǎn)換器,它們是一系列函數(shù),接受資源文件的內(nèi)容做參數(shù),然后返回新的資源(以一個(gè)模塊的形式返回)。

webpack

webpack解析文件時(shí)使用的加載器都聲明在module屬性的loaders數(shù)組中,可以設(shè)置一個(gè)或多個(gè)加載器。

module.noParse:指定某些文件不需要使用解析,支持傳入文件路徑或正則表達(dá)式;

module.loaders:指定解析文件的加載器模塊及各模塊解析規(guī)則,可以設(shè)置以下屬性:

  1. test: 待解析文件需匹配的規(guī)則,通常以文件后綴名稱匹配文件;

  2. include:待解析文件所處目錄;

  3. exclude: 過(guò)濾掉的目錄;

  4. loader:加載器模塊名稱;

  5. loaders多個(gè)加載器;

模塊解析規(guī)則配置

webpack支持在resolve屬性對(duì)象中配置模塊解析規(guī)則,主要有root,modules, alias和extensions屬性。

resolve.root與resolve.modules

該屬性設(shè)置的是在開(kāi)發(fā)代碼中使用require或import加載某模塊時(shí),webpack查找該模塊所遵循的查找目錄范圍,如在源代碼中存在:

var utils = require('utils/utils.js');

而root配置如下:

  resolve: {
    root: [
      path.resolve('./src/'),
      'node_modules'
    ]
  }

webpack編譯時(shí)將自動(dòng)在項(xiàng)目根目錄下的src目錄內(nèi)的utils目錄下查找utils.js,若存在,則返回,否則進(jìn)入node_modules目錄內(nèi)查找utils.js模塊。

當(dāng)然,若未設(shè)置resolve.root屬性值,則webpack默認(rèn)先從node_modules查找模塊,然后在根目錄下查找。

注意:resolve.root在webpack v1版本中使用,而在webpack v2 中,使用modules代替,建議使用v2版本,后文也將統(tǒng)一使用modules屬性。

resolve.alias

alias,有別名的意思,這里的作用是設(shè)置其他模塊或路徑的別名,webpack在解析模塊時(shí),將使用配置值替換該別名,如,在未設(shè)置alias屬性內(nèi)容時(shí),即resolve.alias默認(rèn)是空對(duì)象{}時(shí),我們?cè)诖a中引用模塊:

var Vue = require('vue/dist/vue.js');
var TopHeader = require('components/header.js');

webpack在編譯代碼時(shí),按resolve.modules聲明的順序依次查找對(duì)應(yīng)模塊,如按照上一節(jié)定義的resolve.modules:

  resolve: {
    root: [
      path.resolve('./src/'),
      'node_modules'
    ]
  }

查找模塊時(shí),將首先在src/vue/dist/目錄下尋找vue模塊,在src/components/目錄下查找header.js模塊,查找到后返回,否則進(jìn)入node_modules目錄查找。

現(xiàn)在,我們還可以通過(guò)resolve.alias為模塊或路徑聲明一個(gè)別名,更方便的聲明加載模塊:

  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.js'
      components: path.resolve(__dirname, 'src/components/')
    }
  }

我可以使用如下方式加載模塊:

var Vue = require('vue');
var TopHeader = require('components/header.js');

$符號(hào)

關(guān)于alias的詳細(xì)使用介紹,請(qǐng)參見(jiàn)文檔,本文并不是要介紹webpack文檔,在這里介紹一下聲明的vue$別名中的$符號(hào):

這里的$符合是正則的文末匹配符,即只有當(dāng)vue是最后一級(jí)路徑時(shí),webpack才會(huì)將該值解析成別名,進(jìn)行別名與對(duì)應(yīng)值替換,如vue/test.js中的vue是不會(huì)當(dāng)作別名解析的,而components/header.js中的components則會(huì)按照聲明的components別名進(jìn)行解析,其結(jié)果是src/components/header.js。

resolve.extensions

該值定義解析模塊時(shí)的查找文件的后綴順序,如["", ".js", ".json"],會(huì)優(yōu)先返回js文件,其次json文件,然后是其他文件,注意,這里數(shù)組傳入了一個(gè)空字符串,他的作用是在未找到配置中所有列舉的類型文件時(shí),支持webpack返回其他類型文件,但是webpack2.x版本修改了,不支持傳入空字符。

webpack插件配置

webpack還支持多種多樣的插件拓展,你可以使用它們對(duì)你的項(xiàng)目webpack模塊構(gòu)建過(guò)程進(jìn)行額外處理,如代碼壓縮,圖片等資源提交壓縮,構(gòu)建異常捕獲和提升,構(gòu)建流程時(shí)間消耗比,等等,而關(guān)于這些插件使用的配置在plugins屬性數(shù)組內(nèi),將在后續(xù)進(jìn)行介紹。

項(xiàng)目本地調(diào)試與開(kāi)發(fā)

為了方便開(kāi)發(fā)和調(diào)試,通常都需要在本地主機(jī)開(kāi)啟服務(wù),提供局域網(wǎng)內(nèi)多終端訪問(wèn),并且在文件變更時(shí),實(shí)時(shí)刷新頁(yè)面,正如grunt和gulp中Browsersync插件提供的功能一樣,webpack可以使用webpack-dev-server模塊實(shí)現(xiàn)。

webpack-dev-server是一個(gè)Node.js的express服務(wù)器,以webpack開(kāi)發(fā)中間件的形式為webpack包提供服務(wù),當(dāng)監(jiān)聽(tīng)到源碼文件變更時(shí),會(huì)自動(dòng)重新打包,并且支持配置自動(dòng)刷新瀏覽器,重新加載資源。

安裝

由于該插件只用于開(kāi)發(fā)模式,所以通過(guò)以下npm指令安裝:

npm install webpack-dev-server --save-dev

配置

啟用webpack-dev-server時(shí),其默認(rèn)開(kāi)啟8080端口,訪問(wèn)localhost:8080返回當(dāng)前目錄下的index.html,即執(zhí)行指令當(dāng)前目錄下的靜態(tài)資源,當(dāng)然可以通過(guò)指令傳遞參數(shù)或在配置文件進(jìn)行配置指定靜態(tài)資源目錄。

另外需要注意的是,開(kāi)啟webpack-dev-server后,變更文件重新打包后,并不會(huì)實(shí)際輸出到配置的output目錄,而是在publicPath屬性聲明的相對(duì)路徑所在的內(nèi)存中讀取。

靜態(tài)資源目錄配置(CONTENT BASE)

webpack-dev-server --content-base src/

執(zhí)行以上指令開(kāi)啟服務(wù)后,webpack-dev-server將默認(rèn)在src/目錄返回靜態(tài)資源,當(dāng)然也可以在webpack.config.js配置文件中指定:

  devServer: {
    contentBase: './src'
  }

訪問(wèn)http://localhost:8080和http://localhost:8080/index.html效果一樣,均返回src目錄下的index.html文件。

PUBLICPATH與輸出文件訪問(wèn)

在前文webpack配置一節(jié)中提到output.publicPath屬性值表示,在瀏覽器訪問(wèn)webpack output輸出的文件時(shí)的基礎(chǔ)相對(duì)路徑,如設(shè)置:

  output: {
    path: 'dist/scripts',
    filename: 'app.js',
    publicPath: 'assets/'
  }

則在html文件中引用該app.js文件的方式如下:

<script src="assets/app.js"></script>

在瀏覽器中訪問(wèn)app.js的方式為:http://localhost:8080/assets/app.js

自動(dòng)刷新(AUTOMATIC REFRESH)

前面說(shuō)到webpack-dev-server支持文件變更時(shí),自動(dòng)刷新瀏覽器,這也是開(kāi)發(fā)者急需的功能,webpack-dev-server支持兩種方式實(shí)現(xiàn):

  1. iframe模式(iframe mode):頁(yè)面通過(guò)iframe窗口插入然后變更時(shí)自動(dòng)重新加載;

  2. inline模式(inline mode):通過(guò)sock.js(比如websocket協(xié)議,輪詢等方式)在頁(yè)面嵌入一個(gè)小型客戶端與webpack-dev-server服務(wù)器建立連接,當(dāng)發(fā)生變更重新打包時(shí),通過(guò)此連接通知頁(yè)面重新加載;

iframe模式

使用默認(rèn)的iframe模式時(shí),不需要進(jìn)行任何配置,可以直接訪問(wèn):http://localhost:8080/webpack-dev-server/index.html即可,如圖,通過(guò)iframe插入我們的頁(yè)面:

如何搭建webpack與SPA開(kāi)發(fā)環(huán)境

注意:

  1. 在應(yīng)用頁(yè)面上方會(huì)有狀態(tài)欄顯示當(dāng)前應(yīng)用信息;

  2. 應(yīng)用URL的變更發(fā)生在iframe內(nèi)部,不會(huì)反映在瀏覽器地址欄;

inline模式

要開(kāi)啟inline模式,只需要指定--inline命令行參數(shù)或在配置文件中指定inline: true:

  devServer: {
    contentBase: './src',
    inline: true
  }

在此模式下,直接訪問(wèn)http://localhost:8080/index.html或http://localhost:8080即可,此模式與iframe模式的區(qū)別在于:

  1. 訪問(wèn)URL不同;

  2. 需指定inline配置參數(shù);

  3. 應(yīng)用信息在控制臺(tái)輸出;

  4. 應(yīng)用URL的變更直接反映在瀏覽器地址欄;

其實(shí)inline模式還可以配合Node.Js服務(wù)運(yùn)行,之后再介紹,這里只說(shuō)明了其在HTML文檔中的使用。

熱替換(HOT MODULE REPLACEMENT)

除了自動(dòng)刷新,webpack-dev-server的另一大賣(mài)點(diǎn)是模塊熱替換,那么熱替換到底是什么?

熱替換,即文件發(fā)生變更時(shí),webpack包只替換發(fā)生變更的模塊,而不需要全部替換;瀏覽器不需要完全重新加載,而可以直接將變更的模塊注入到運(yùn)行中的應(yīng)用。

開(kāi)啟熱替換功能需要指定--hot指令參數(shù),或在配置文件中添加:

  devServer: {
    contentBase: './src',
    inline: true,
    hot: true
  }

注意到以上代碼,熱替換需要與inline模式一起使用,另外需要指定output.publicPath值。

HotModuleReplacementPlugin

配置好后還需要使用webpack.HotModuleReplacementPlugin插件,才能真正啟用熱替換功能:

  plugins: [
    new webpack.HotModuleReplacementPlugin()
  ]

同樣的,熱替換可以搭配Node.js服務(wù)一起使用,之后介紹。

如圖,為每個(gè)文件(app.js, test.js)都實(shí)現(xiàn)了HMR熱替換,當(dāng)發(fā)生變更時(shí),只更新變更模塊,而不是重新加載所有文件:

如何搭建webpack與SPA開(kāi)發(fā)環(huán)境

擁抱ES6

ES6推出以來(lái),廣受Jser們青睞,其確實(shí)有很多新特性和新規(guī)范,值得我們深入學(xué)習(xí)并使用,未來(lái)所有的JavaScript應(yīng)用都應(yīng)該擁抱ES6,不過(guò),目前各大瀏覽器都在推進(jìn)ES6的實(shí)現(xiàn),在兼容實(shí)現(xiàn)之前,我們還需要過(guò)渡性的將其轉(zhuǎn)換成ES5語(yǔ)法,最通用的方式就是使用babel轉(zhuǎn)換。

使用BABEL加載器

首先,為了能使用webpack和babel轉(zhuǎn)換js代碼,需要使用babel-loader加載器,另外還需要安裝babel轉(zhuǎn)換js的轉(zhuǎn)換規(guī)則插件,如babel-preset-es2015定義了轉(zhuǎn)換規(guī)則,安裝方式如下:

npm install --save-dev babel-loader babel-preset-es2015

然后在根目錄下創(chuàng)建.babelrc文件,內(nèi)容:

  {
    "presets": ["es2015"]
  }

在webpack.config.js配置文件中,添加相關(guān)loader配置:

  module: {
    loaders: [
      {
        test: /\.(js|vue)$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
      }
    ]
  }

其中,test匹配需要轉(zhuǎn)換的文件,exclude匹配不需要轉(zhuǎn)換的文件或目錄。

BABEL-POLYFILL

我們需要明白的一點(diǎn)是babel-preset-es2015能做的,只是轉(zhuǎn)換ES6代碼成ES5,使得瀏覽器可以解析執(zhí)行,但是對(duì)于ES6新提出的API,如Promise,Generator等無(wú)法簡(jiǎn)單的轉(zhuǎn)換成ES5代碼,這時(shí)就需要babel-polyfill了,babel-polyfill是一個(gè)墊片,它可以模擬提供所有的ES6功能和特性,可以看作是提供了一個(gè)模擬的全局ES6環(huán)境。

安裝

安裝依然很簡(jiǎn)單,由于是墊片,是需要在源碼中使用的,所有指定--save參數(shù):

npm install --save babel-polyfill

使用

不同于babel-preset-es2015,babel-polyfill需要直接打包進(jìn)源碼,而且需要在使用ES6代碼前引入一次:

import 'babel-polyfill'

只需要引入一次,因?yàn)樵搲|片提供的是一個(gè)模擬的全局ES6環(huán)境,而不是模塊內(nèi)部的。

或者直接在webpack.config.js中配置打包入口文件時(shí)加入該墊片:

  entry: {
    app: ['babel-polyfill', './scripts/app.js']
  },

現(xiàn)在你可以在你的代碼中使用任何你想用的ES6 API了。

感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“如何搭建webpack與SPA開(kāi)發(fā)環(huán)境”這篇文章對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司,關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司行業(yè)資訊頻道,更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無(wú)理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、網(wǎng)站設(shè)計(jì)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

本文標(biāo)題:如何搭建webpack與SPA開(kāi)發(fā)環(huán)境-創(chuàng)新互聯(lián)
文章源于:http://muchs.cn/article32/phgpc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站維護(hù)、標(biāo)簽優(yōu)化服務(wù)器托管、商城網(wǎng)站、響應(yīng)式網(wǎng)站、軟件開(kāi)發(fā)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)公司