项目环境搭建:

1.安装node   (node  -v查看node版本)

2.全局安装vue-cli

Npm install  -g  vue-cli

Vue:查看是否安装成功

Vue list:查看可用的模板

3.创建一个基于 "webpack" 模板的新项目

Vue init webpack project-name(默认安装2.0版本)

Vue init webpack#1.0 project-name(安装1.0版本)

脚手架工具如下:


-build中配置了webpack的基本配置、开发环境配置、生产环境配置等

 

-config中配置了路径端口值等

 

-node_modules为依赖的模块

 

-src放置组件和入口文件

 

-static放置静态资源文件

 

-index.html文件入口

webpack中的一些解释

new HtmlWebpackPlugin 这个插件的作用是把output输出的文件自动插入到html

 

1.cd project-name

2.Npm install

3.Npm run dev

4.在浏览器输入localhost:8080 效果如下:


因为使用了stylus语法,安装完stylus-loader后依然报错,是因为npm 3+ 会报错,所以还需手动安装stylus。

问题一:安装stylus-loader遇到的问题:

 

解决方法:npm i sytlus --save --dev




 

成功解决!

问题二:

vue-router应用于组件内时的矛盾

 

 

解决方法:如果遇到此问题,将VueRouter的引用放在App的引用下面,App.vue先编译完成

 



成功解决

问题三:

因为项目中使用了字体图标,路径也没有问题别人那里也不报错但是我这里编译后总是报错:


后来终于解决了:


之前是想直接引用index.styl文件,但是编译报错,后来发现这样引用问题成功解决



Logo

前往低代码交流专区

更多推荐