注意:
创建vue用create命令:https://blog.csdn.net/qq_43470725/article/details/125828367
不要使用vue init webpack myvue这个老命令了,会有各种其他问题!
需要的环境:
http://nodejs.cn/download/
选择适合自己电脑的安装包,现在一般64位:
下载好后会自动配置好环境变量!
windows下cmd测试:
安装node后自带npm
成功!
安装Node.js淘宝镜像加速器(cnpm)
-g 就是全局安装
npm install cnpm -g
或使用如下语句解决npm速度慢的问题
npm install --registry = https://registry.npm.taobao.org
然后去c盘:因为是全局安装的,所以在隐藏的默认目录下:
C:\Users\admin\AppData\Roaming
安装vue-cli
cnpm install vue-cli -g
vue list
创建vue程序:
vue init webpack myvue
步骤:
Project name myvue -------回车
Project description A Vue.js project -------回车
Author 写自己的名字(自定义)
Vue buil(Use arrow keys)-----------------选第一个
runtime +…
runtime -only…
Install vue-router? -----------------------n 自己手动安装
Use eslint to lint your code? --------------n
剩下的都自己手动安装,一路选择no就行了!
package.json:包管理,npm根据这个下载
cd myvue
npm install
报错后,会有指令提示,直接执行它提示的指令就行
启动当前项目:
npm run dev
这个就是node.js的服务器,和tomcat是一样的道理!!!
contry+c停止node.js服务
项目结构:
idea运行不了表示不是管理员模式:
设置idea默认管理员运行,也可以直接用cmd窗口运行
设置idea:
源码在src里面:
入口是在main.js里面:
APP就是App.vue:
build包:
build.js:构建
es6:严格模式 ‘use strict’
编译时就报错!!!
check-version.js:检查所有东西的版本
webpack:打包的js
入口:
webpac-base:基础环境
webpac-dev:开发配置
webpac-prod:生成环境
config包:
dev.env.js
const prodEnv = require(‘./prod.env’)
说明当前是生成环境
index.js:
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
可以配置端口号
assetsSubDirectory: ‘static’
静态资源存放目录位置static
css、js都放在这个下面
node_modules:npm下载的资源,前端运行起来需要的所有组件
index.heml:
程序主入口
export:
export:导出一个组件,可以让其他组件导入调用
import
import HelloWorld from ‘./components/HelloWorld’
import 导入组件,然后就可以调用了