搭建vue專案

2021-10-07 14:06:02 字數 1259 閱讀 8066

兩種方法都需要安裝node

用腳手架搭建vue專案非常簡單快速，先安裝vue-cli

npm install vue-cli -g
然後vue init webpack 專案名即可

在命令框中cd到目的資料夾下npm init -y建立專案的package.json檔案

區域性安裝webpack，並進行配置npm install webpack webpack-cli -d安裝webpack外掛程式，配置webpack.config.js

npm install html-webpack-plugin -


dnpm install webpack-dev-sev -


d//自動重新構建，自動重新整理伺服器
4.安裝可以實現.css、.less、.sass檔案的編譯的loader

npm install style-loader css-loader -


dnpm install node-sass sass-loader -


dnpm install less less-loader -


dnpm install stylus stylus-loader -


d
5.載入器安裝

npm install file-loader url-loader -


d
6.對es6編譯為es5, 建立配置檔案.babelrc.json

npm install @babel/core @babel/preset-env -


dnpm install babel-loader -


dnpm install @babel/plugin-transform-runtime @babel/runtime -


d
7.由於webpack 不能直接編譯.vue檔案，所以需要安裝

npm install vue-loader vue-template-complier
8.配置webpack.config.js以及在package.json中進行編譯命令的配置。

更具體的內容參見

vue專案搭建

前提安裝好node不再贅述 可以在自帶的命令列中執行,也可以在webstome中執行 安裝cnpm npm install g cnpm registry 安裝webpack 這一步可以省略,反正你也不會用 cnpm install webpack g 全域性安裝 vuecnpm install g...

Vue專案搭建

vue cli 專案搭建及常用外掛程式安裝，報錯解決 環境搭建 node v 檢測版本 2.安裝webpack npm install webpack g webpack v 檢測是否安裝成功 專案搭建 1.npm install vue cli g vue v 接下來的步驟有兩種方式 1 cd 進...

vue專案搭建

1 安裝 映象，用cnpm裝東西很省事，目前沒被坑過 一下命令在cmd中完成 可以不按裝 npm install g cnpm registry 2 安裝vue腳手架 cnpm install g vue cli測試是否成功安裝 vue v 3.進入安裝的資料夾目錄，構建檔案結構目錄 vue ini...