博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
引用测试自己的vue组件
阅读量:7198 次
发布时间:2019-06-29

本文共 842 字,大约阅读时间需要 2 分钟。

--基于parcel

假设用户使用vue cli

关于旧版本

Vue CLI的包名称由vue-cli改成了@vue/cli。如果你已经全局安装了旧版本的vue-cli(1.x或2.x),你需要先通过npm uninstall vue-cli -g或yarn global remove vue-cli卸载它。

npm install -g @vue/cli# oryarn global add @vue/cli复制代码

可以使用npm命令来安装,但是我发现npm老是报错,所以改用yarn来安装

npm install yarn

npm和yarn不能混着用

$ vue --version //3.7.0

运行以下命令来创建一个新项目:

vue create hello-world

你会被提示选取一个预设。你可以选默认的包含了基本的Babel + ESLint设置的预设(一直回车),也可以选“手动选择特性”来选取需要的特性。

根据提示进入 hello-world cd hello-world

运行 yarn serve

打开网址,得到了我们的第一个vue-app。

进入src>main.js

在hello-world文件夹安装自己的组件,不能使用淘宝镜像,因为只上传到了npm平台

yran add vue-wheel

这个警告只是说hapi组件被弃用了

下载完成之后就可以在mian.js引用

打开网址。结果报错。

因为组件使用的是import语法,而node是不支持的

我们应该用babel把它转换成,可以执行的js

在组件目录内运行 npm parcel build index.js --no-minify

把package.json内入口文件index.js改为dist/index.js  同时升级版本号

在引用目录内,重装组件  yarn add vue-wheel 

运行 yran serve

结果成功

在app.vue内引入组件,技术有限,手动引入css

完成

转载地址:http://fhkum.baihongyu.com/

你可能感兴趣的文章
提示“本地连接没有有效的ip配置-未修复“窗口
查看>>
TTS备份实验
查看>>
Markdown 學習
查看>>
又一年...
查看>>
CLLocation
查看>>
mac 下 用 glfw3 搭建opengl开发环境
查看>>
IIC学习(一)
查看>>
Linux内核学习笔记(1)-- 进程管理概述
查看>>
Apache Avro 与 Thrift 比较
查看>>
搞ACM的你伤不起
查看>>
operator的各种问题
查看>>
存储OS
查看>>
php学习php://input输入流和curl
查看>>
编码问题 php字符编码转换类
查看>>
地铁事件对系统稳定性、可用性的思考
查看>>
批量分发数据批量管理服务器多案例讲解(学生分享)
查看>>
利用ansible modules模块来自定义集群管理
查看>>
Nginx+Resin高性能JAVA平台搭建
查看>>
【ZooKeeper Notes 7】使用super身份对有权限的节点进行操作
查看>>
Linux下高并发socket最大连接数所受的各种限制
查看>>