vue开发(2) 使用vue-cli来构建项目
1. cd 切換到項目目錄
vue init webpack項目中的目錄如下:
build:最終發布的代碼的存放位置。
config:配置路徑、端口號等一些信息,我們剛開始學習的時候選擇默認配置。
node_modules:npm 加載的項目所需要的各種依賴模塊。
src:這里是我們開發的主要目錄(源碼),基本上要做的事情都在這個目錄里面,里面包含了幾個目錄及文件:
assets:放置一些圖片,如logo等
components:目錄里放的是一個個的組件文件
router/index.js:配置路由的地方
App.vue:項目入口組件(跟組件),我們也可以將組件寫這里,而不使用components目錄。主要作用就是將我們自己定義的組件通過它與頁面建立聯系進行渲染,這里面的必不可少。
main.js :項目的核心文件(整個項目的入口js)引入依賴包、默認頁面樣式等(項目運行后會在index.html中形成一個app.js文件)。
static:靜態資源目錄,如圖片、字體等。
test:初始測試目錄,可刪除
.XXXX文件:配置文件。
index.html:html單頁面的入口頁面,可以添加一些meta信息或者同統計代碼啥的或頁面的重置樣式等。
package.json:項目配置信息文件/所依賴的開發包的版本信息及所依賴的插件信息。
README.md:項目的說明文件。
webpack.config.js:webpack的配置文件,把.vue的文件打包成瀏覽器能讀懂的文件。
.babelrc:是檢測es6語法的文件的配置
.getignore:忽略文件的配置(比如模擬本地數據mock不讓他在get提交/打包上線的時候忽略不使用可在這里配置)
.postcssrc.js:前綴的配置
.eslintrc.js:配置eslint語法規則(在這里面的rules屬性中配置讓哪個語法規則失效)
.eslintignore:忽略eslint對項目某些文件的語法規則的檢查
2. cnpm install
安裝項目所需要的依賴包/插件
3 運行項目 npm run dev
在項目目錄中,運行命令 npm run dev (npm run start)
總結
以上是生活随笔為你收集整理的vue开发(2) 使用vue-cli来构建项目的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: vue开发(1) 软件安装
- 下一篇: C++ Primer 5th笔记(10)