菜鸟入门vue和ElementUI
由
Deepseek提供支持
广告
今天将使用vue+elementUI第一次搭建项目的过程记录下来(Mac电脑)前提条件:电脑上已经装过npm/cnpm
在本地先新建了一个存储项目的文件夹,比如:test。或者直接在c盘d盘都可以
在终端/命令行里面进入这个地址 cd test
vue init webpack-simple element-demo
这里会让输入 项目名称、介绍、作者之类的,直接按enter键就可以 还会询问是否使用sass,选择no/yes均可,看你需要cd element-demo 进入项目npm installnpm install style-loader -S —-用来解析css的,必须安装npm i element-ui -D 补充:i-> install D-> –save-dev S-> –save 如果怕端口号冲突,可以修改,在package.js的dev后面添加 –port 8099 就可以(8099自己随便定义的)
"scripts":{ "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot --port 8099", "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" }
在main.js中引入elementui
import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.use(ElementUI)
然后npm run dev,发现报错
错误信息.png 解决方案:webpack.config.js添加配置
{test: /\.(eot|svg|ttf|woff|woff2)$/, loader: 'file-loader' }
配置完config.js后,ctrl+c结束命令,再执行npm run dev
成功!!
温馨提示 : 非特殊注明,否则均为©李联华的博客网原创文章,本站文章未经授权禁止任何形式转载;来自:俄亥俄州·哥伦布 ,欢迎您的访问!
文章链接:https://www.lilianhua.com/beginner-vue-and-elementui.html
文章链接:https://www.lilianhua.com/beginner-vue-and-elementui.html
English (US)
Español (ES)
Português (PT)
Français (CA)
Español (MX)
Español (VE)
Español (CO)
Español (AR)
Português (BR)
Quechua (PE)
Guaraní (PY)
简体中文 (ZH)
繁體中文 (HK)
日本語 (JP)
한국어 (KR)
हिन्दी (HI)
Pilipino (PH)
ไทย (TH)
Tiếng Việt (VN)
Bahasa Melayu (MY)
Bahasa Indonesia (ID)
বাংলা (BD)
اردو (PK)
සිංහල (LK)
ភាសាខ្មែរ (KH)
English (UK)
Français (FR)
Deutsch (DE)
Italiano (IT)
Русский (RU)
Nederlands (NL)
Türkçe (TR)
Polski (PL)
Svenska (SE)
Norsk (NO)
Dansk (DK)
Suomi (FI)
Ελληνικά (GR)
Čeština (CZ)
Magyar (HU)
Română (RO)
Български (BG)
Српски (RS)
Українська (UA)


