当前位置: 首页 > 软件库 > Web应用开发 > Vue 组件 >

parcel-vue

基于 parcel 打包工具的 Vue.js 开发脚手架
授权协议 MIT
开发语言 JavaScript
所属分类 Web应用开发、 Vue 组件
软件类型 开源软件
地区 国产
投 递 者 凌征
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

parcel-vue,全新打包工具parcel零配置vue开发脚手架。

parcel-vue是一个基于parcel打包工具的vue急速开发脚手架解决方案,强烈建议使用node8.0以上

初始化项目

// 安装脚手架
$ npm install parcel-vue -g
// 初始化
$ parcel-vue projectName

安装依赖

$ cd projectName
$ npm install

其中parcel-bundler是主要的工具,对于vue结尾的单文件,需要单独处理文件类型, parcel-plugin-vue这个插件会通过vueify来生成对应的代码,parcel会自动加载parcel-plugin开头的依赖。

运行开发环境,运行成功打开浏览器http://localhost:1234即可查看项目

$ npm run dev

打包编译

$ 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 dev 和 npm run build 就可以进行开发和构建。

路由懒加载

只需将传统 import page from 'path' 方式改为 const page = () => import('path') 即可

// 此种方式路由不会懒加载
import HelloWorld from '../views/HelloWorld/HelloWorld.vue'
// 此种方式引入即可实现路由懒加载,打包时js文件自动拆分
const HelloWorld =  () => import('../views/HelloWorld/HelloWorld.vue')

nodejs版本升级,如果您的node版本低于8.0,我们强烈建议您升级node版本(命令行升级不支持windows)

$ npm install -g n
$ n stable
  • 前沿 parcel 工具的优点: 1、 Parcel 使用工作进程启用多核编译,并具有文件系统缓存,即使在重新启动后也可快速重新构建。 2 、Parcel 支持JS,CSS,HTML,文件资源等等 - 不需要安装任何插件。 3、在需要时,代码使用 Babel,PostCSS 和 PostHTML 自动转换 - 即使是 node_modules。 4、Parcel 使用动态 import() 语法拆

  • 前言 像我们熟悉的 vue-cli,create-react-app 等脚手架,只需要输入简单的命令 vue init webpack project,即可快速帮我们生成一个初始项目。在实际工作中,我们可以定制一个属于自己的脚手架,来提高自己的工作效率。 为什么需要需要脚手架? 减少重复性的工作,不再需要复制其他项目再删除无关代码,或者从零创建一个项目和文件。 根据交互动态生成项目结构和配置文件等

  • 新的打包工具parcel,号称零配置,开箱即用,今天迫不及待入手看看~ 以vue作为示例: demo 目录结构 src ├── App.vue ├── index.js ├── router.js └── components ├── ├── Home.vue ├── └── ... .babelrc index.html package.json readme.md (1)创建根目录 p

 相关资料
  • Parcel is a zero configuration build tool for the web. It combines a great out-of-the-box development experience with a scalable architecture that can take your project from just getting started to ma

  • 14.1.3.实现一个Parcel 进程间传递的Message也是个Java对象,在传递与接收之间我们需要额外进行编码/解码——也就是序列化/反序列化。在Android中,可以序列化/反序列化的对象就被称作Parcel,作为Parcelable接口的实例。 作为Parcel,对象必须知道如何处理自身的编码/解码。 例 14.4. Message.java package com.marakana.

  • 在一个使用作为包管理器和作为捆绑器的Web项目中,我想让Parcel将Transcrypt(Python)文件转换为Javascript。 为此,我安装了< code > package-plugin-transcrypt 。但是现在,当我通过< code >包裹服务捆绑项目时,我得到以下错误: 找不到模块“包裹捆绑器/src/Logger” 谷歌搜索显示,这似乎是其他插件也遇到的一些版本问题。但

  • 使用说明 概述 轻推JAVA-SDK是轻推开放平台面向Java开发者提供的发工具包。通过使用轻推JAVA-SDK,Java开发者可借助轻推高效地使用消息推送,安全登录等功能。 此文档面向Java开发者介绍轻推JAVA-SDK如何使用及相关注意事项。 使用步骤 步骤一:获取AppID以及AppSecret 登录轻推企业管理系统,编辑轻应用/订阅号,获取AppID以及AppSecret,若需要使用轻推

  • 本文向大家介绍详解vue组件开发脚手架,包括了详解vue组件开发脚手架的使用技巧和注意事项,需要的朋友参考一下 generator-vue-component可以快速生成自己的组件开发的脚手架,类似于vue-cli生成vue项目,这脚手架是目录结构是方便组件开发和调试 由于脚手架是由yeoman搭建,所以必须全局安装yeoman npm install yo 然后全局安装generator-vue

  • vue项目已经使用UglifyJsPlugin进行打包压缩了,上级要求项目打包之后js文件再小点,还有什么处理办法呢? 希望大佬们能给点建议,如果可以的话,有点代码支持! 拜谢!!!