Hbuilder X 创建Vue2项目详细过程

最新推荐文章于 2025-04-01 14:21:02 发布

小苏打白

最新推荐文章于 2025-04-01 14:21:02 发布

阅读量2.8k

点赞数 2

分类专栏：前端文章标签： vue.js 前端 javascript

原文链接：https://juejin.cn/post/7202639428132044858

版权

前端专栏收录该内容

4 篇文章

订阅专栏

在升级到Node.js18.15.0后，由于OpenSSL3.0的严格限制，Vue项目构建时遇到error:0308010C:digitalenveloperoutines::unsupported错误。该问题可以通过在系统环境变量中添加NODE_OPTIONS，值设为--openssl-legacy-provider来解决。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方法/步骤
1.首先打开Hbuilder创建一个新项目，如下图所示
在这里插入图片描述
2.接着模板选择Vue项目，如下图所示

3.然后等待一会项目就创建好了，如下图所示

4.接着右键单击选择npm run build，如下图所示

5.然后继续右键单击选择npm run serve，如下图所示

6.接着找底部出现的地址和端口号，如下图所示
在这里插入图片描述
7. 最后在浏览器中输入即可访问vue页面了，如下图所示

遇见的困难

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at module.exports (W:\VueTest\Vue_Demo\node_modules\webpack\lib\util\createHash.js:90:53)
    at NormalModule._initBuildHash (W:\VueTest\Vue_Demo\node_modules\webpack\lib\NormalModule.js:401:16)
    at handleParseError (W:\VueTest\Vue_Demo\node_modules\webpack\lib\NormalModule.js:449:10)
    at W:\VueTest\Vue_Demo\node_modules\webpack\lib\NormalModule.js:481:5
    at W:\VueTest\Vue_Demo\node_modules\webpack\lib\NormalModule.js:342:12
    at W:\VueTest\Vue_Demo\node_modules\loader-runner\lib\LoaderRunner.js:373:3
    at iterateNormalLoaders (W:\VueTest\Vue_Demo\node_modules\loader-runner\lib\LoaderRunner.js:214:10)
    at Array.<anonymous> (W:\VueTest\Vue_Demo\node_modules\loader-runner\lib\LoaderRunner.js:205:4)
    at Storage.finished (W:\VueTest\Vue_Demo\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:43:16)
    at W:\VueTest\Vue_Demo\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:79:9
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v18.15.0

npm run serve报错信息

出现原因：

当 nodejs 升级到17+版本以后，开始支持 OpenSSL 3.0，而 OpenSSL 3.0 对各种摘要算法做了更严格的限制，可能会导致一些程序运行错误。具体原因参考由nodejs升级引起的构建错误：0308010C:digital envelope routines::unsupported - 掘金 (juejin.cn)