笔记： vue2项目 目录、创建、部署；nvm安装和node版本修改

一、项目目录 

二、vue create 创建项目（我全程以管理员身份运行的cmd）

1、安装脚手架工具 npm install -g @vue/cli 

        或 npm install -g vue-cli（升级脚手架 npm update -g @vue/cli）

2、创建项目 vue create project

        如果报错：vue : 无法加载文件.....\vue.ps1，因为在此系统上禁止运行脚本。

        ------以管理员身份运行终端或者 PowerShell 

3、选择Preset（vue2）

        【如果需要选择包管理器（npm）、部署 npm install -g serve】

4、运行npm run serve

5、打包npm run build 生成dist文件夹

6、部署到服务器----将dist文件夹内容上传

        vue2项目遇到问题记录：页面空白，需修改vue.config.js的publicPath，内容为：

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  lintOnSave: false,
  publicPath: './',/**打包后的路经重定向**/
})

三、hbuilder直接创建项目（未测试部署）

1、新建项目

2、运行npm run serve

        如果报错：

opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'

• 终端输入       $env:NODE_OPTIONS="--openssl-legacy-provider"      或                                set NODE_OPTIONS=--openssl-legacy-provider
• 将 node.js 版本降到 v16+

3、打包npm run build 生成dist文件夹

        如果报错：

• get-ExecutionPolicy （获取执行策略）   -------输出：RemoteSigned 
• Set-ExecutionPolicy -Scope CurrentUser （设置当前用户权限） ----ExecutionPolicy:

• RemoteSigned

4、部署到服务器----将dist文件夹内容上传

        vue2项目遇到问题记录：页面空白，需修改vue.config.js，如果没有需要手动添加文件，内容为：

module.exports = {
    assetsDir: 'static',
    parallel: false,
    publicPath: './', 
    /*
        如果项目中引用了静态文件比如图片路径是   ./ 或者../ 
        打包时候需要求改为 ./ 如果没有人用任何非网络路径的就默认 / 就ok了
    */
}

四、扩展：将 node.js 版本18降到 v16+

       下载nvm工具（ 安装：cmd查找node安装路径：where node ，和node文件夹同级）nvmhttps://github.com/coreybutler/nvm-windows/releases

        

        安装过node再安装nvm可能需要多次点击确认，安装完成后重启cmd，

        nvm -v：查看nvm是否安装成功；

        nvm install 16.16.0：安装node版本；

        nvm ls available：查看所有可安装的node版本 ；

        nvm ls：查看所有已安装可使用的node版本 ；

        nvm use 16.16.0：使用node版本 ；

        node -v：查看node版本

        

 五、vite搭建学习：

vite搭建vue2项目 - 简书