【vue-cli 3.0】 vue.config.js配置 - 路徑別名

Crazy_Coder 發布于2019-08-23 11:27 / 3530人閱讀

摘要：如何配置中的路徑別名前段時間更新電腦重裝了一下，發現了已經更新到版。那么怎么在中配置路徑別名呢創建項目在根目錄下新建修改之所以用，是因為偷了個懶利用中中已經配好的路徑有興趣的可以進入文件里面看一看參考文檔相關簡單的配置方式

如何配置vue-cli 3中vue.config.js的路徑別名？

前段時間更新電腦重裝了一下vue-cli，發現了vue-cli已經更新到3.0版。用來搭建項目后發現簡化了很多，而且配置文件現在可以全部統一在vue.config.js中，很方便有沒有，從此以后一個配置文件走遍公司大小項目，媽媽再也不用擔心我每次新建項目時重新配置各個復雜的選項了。那么怎么在vue.config.js中配置路徑別名呢？

1. 創建項目 2. 在根目錄下新建 vue.config.js 3. 修改vue.config.js

// vue.config.js
module.exports = {
  configureWebpack: {
    resolve: {
      alias: {
        "assets": "@/assets",
        "components": "@/components",
        "views": "@/views",
      }
    }
  },
}

之所以用"@/assets"，是因為偷了個懶利用3.x中/node_modules/@vue/cli-service/lib/config/base.js中已經配好的@路徑,有興趣的可以進入文件里面看一看

···
    webpackConfig.resolve
      .set("symlinks", false)
      .extensions
        .merge([".js", ".jsx", ".vue", ".json"])
        .end()
      .modules
        .add("node_modules")
        .add(api.resolve("node_modules"))
        .add(resolveLocal("node_modules"))
        .end()
      .alias
        .set("@", api.resolve("src"))
        .set(
          "vue$",
          options.runtimeCompiler
            ? "vue/dist/vue.esm.js"
            : "vue/dist/vue.runtime.esm.js"
        )
···

參考文檔：
vue-cli3 webpack 相關簡單的配置方式
webpack resolve.alias

云服務器 GPU云服務器 linux磁盤sda配置別名路徑配置文件 mysql路徑配置 linux 路徑配置

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/96992.html

【vue-cli 3.0】 vue.config.js配置 - 路徑別名

摘要：如何配置中的路徑別名前段時間更新電腦重裝了一下，發現了已經更新到版。那么怎么在中配置路徑別名呢創建項目在根目錄下新建修改之所以用，是因為偷了個懶利用中中已經配好的路徑有興趣的可以進入文件里面看一看參考文檔相關簡單的配置方式如何配置vue-cli 3中vue.config.js的路徑別名？前段時間更新電腦重裝了一下vue-cli，發現了vue-cli已經更新到3.0版。用來搭建項目后...

cikenerd 2019-08-02 11:19 評論0 收藏0
基于vue-cli3.0的項目工程重新構建空白版，拿來即用

摘要：寫在前面使用框架開發時，很多人會選擇官方提供的腳手架，最新的已經更新到完全無配置，只需下載就能方便的使用構建的項目工程，但基礎的并不能滿足正常的項目開發，在開發中我們需要根據自己的習慣和業務功能而添加些基礎功能。寫在前面使用vue框架開發時，很多人會選擇vue官方提供的cli腳手架，最新的cli已經更新到3.0完全無配置，只需下載就能方便的使用vuecli構建的項目工程，但基礎的c...

xingpingz 2019-08-26 10:33 評論0 收藏0
vue-cli 3.0 使用

摘要：安裝如果想要使用首先需要全局安裝，前提要求版本必須是及以上默認會覆蓋，如果想要在使用版本的時候同時使用版本，那么執行以下命令該命令是安裝一個橋接工具，版本的命令依然會被保留創建也可以通過命令打開一個圖形化界面進行配置配置在版本中會安裝如果想要使用vue cli 3.0 首先需要全局安裝，前提要求Node.js版本必須是8.0及以上 npm install -g @vue/cli v...

PumpkinDylan 2019-08-23 15:14 評論0 收藏0
基于vue-cli3.0構建功能完善的移動端架子

摘要：對應每一個環境可能都會有所差異，比如說服務器地址接口地址地址等等。具體的值取決于應用運行的模式。會和中的選項相符，即你的應用會部署到的基礎路徑。基于vue-cli3.0構建功能完善的移動端架子，主要功能包括 webpack 打包擴展 css：sass支持、normalize.css、_mixin.scss、_variables.scss vw、rem布局跨域設置 eslint設置...

Loong_T 2019-08-23 17:05 評論0 收藏0
vue-cli3.0初體驗～

摘要：比如傳遞給時，使用。為所有的及其預處理文件開啟。在生產環境下為和使用在多核機器下會默認開啟。是否使用分割供應的包也可以是一個在包中引入的依賴的顯性的數組。查閱配置行為。之前因為parcel的出現，webpack也跟進了零配置vue-cli自然也不能落下,cli3.0也升級到webpack4，并增加許多新特性安裝并創建一個項目支持npm和yarn npm install -g @v...

AlphaWallet 2019-08-22 15:57 評論0 收藏0