文章目录
环境安装
- 升级npm
npm install -g npm
- 切换到淘宝镜像
npm config set registry "https://registry.npm.taobao.org"
- 安装webpack
npm install webpack -g
- 安装脚手架
npm install webpack webpack-cli -g
- 查询版本
webpack -v
- 安装vue
npm install -g @vue/cli
- 验证版本
搭建项目
- 创建项目
vue create 项目名称
- 选择第三个手动安装
- 选择要使用的插件
- 选择vue版本
- 不使用history模式，因为刷新界面会变成空白
- 选择css模式，我个人熟悉less所以选择less，可自由选择
- 代码规范，我选择标准
- 代码检查，选择保存时检查
- 配置文件存放规则，我习惯用一个配置文件配置所以选择package
- 是否保存当前选择模式方便之后使用，我选择no
- 启动项目
npm run serve
- 测试访问
工程整理
- 修改前端路由
- 修改首页
- HelloWord改为main，并清除无效代码
- 清楚无效代码
问题
问题一： 因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。
使用管理员权限打开PowerShell然后执行图中命令
set-ExecutionPolicy RemoteSigned 接着再输入Y
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-nVhBqkBx-1626160359384)(en-resource://database/671:1)]
问题二：如果出现python找不到就安装python2.7（默认路径安装）
问题三：如果出现visual studio C++运行库找不到就安装一个visual studio
github.com/nodejs/node…
直接点击上方的蓝色字体就可以下载，安装完成后在管理员cmd执行一下命令就可以了
npm config set msvs_version 2017