1. 程式人生 > >原創全新打包工具Parcel零配置VueJS開發腳手架

原創全新打包工具Parcel零配置VueJS開發腳手架

加載 router log comm 打包 一個 ins segment hub

parcel-vue 一個基於Parcel打包工具的 VueJS急速開發腳手架解決方案,強烈建議使用node8.0以上

項目地址: https://github.com/w3c-king/p...

初始化項目

$ git clone https://github.com/w3c-king/parcel-vue.git


<h4>安裝依賴</h4>
<pre class="brush:shell">$ cd parce-vue
$ npm install

其中parcel-bundler是主要的工具,對於vue結尾的單文件,需要單獨處理文件類型,
parcel-plugin-vue

這個插件會通過vueify來生成對應的代碼,parcel會自動加載parcel-plugin開頭的依賴。

運行開發環境,運行成功後打開瀏覽器 http://localhost:1234 查看項目

$ npm run dev


<h4>打包編譯</h4>
<pre class="brush:shell">$ npm run build

開發

目錄結構

src
├── router
    ├── index.js
├── assets
    ├── logo.png
├── components
    ├── Hello
        ├── index.js
    ├── index.js
├── views
    ├── HelloWorld
        ├── images
            ├── logo.png
        ├── HelloWorld.vue
├── styles
    ├── common.css
├── store
    ├── global
        ├── global.js
        ├── index.js
    ├── index.js
├── app.vue
├── index.js

只需要執行npm run devnpm run build 就可以進行開發和構建。

nodejs版本升級,如果您的node版本低於8.0,我們強烈建議您升級node版本(命令行升級不支持windows)

$ npm install -g n
$ n stable
```

原文地址:https://segmentfault.com/a/1190000012767502

原創全新打包工具Parcel零配置VueJS開發腳手架