解决新建一个vue项目过程中遇到的问题

我就废话不多说了,大家还是直接看代码吧~

/usr/local/bin/node /usr/local/lib/node_modules/npm/bin/npm-cli.js run dev --scripts-prepend-node-path=auto

> mytodolists@1.0.0 dev /Users/chenqiurui/WebstormProjects/myVue
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

 0% compiling
 10% building modules 1/1 modules 0 active
 10% building modules 1/2 modules 1 active …r/client/index.js?http://localhost:8080
 10% building modules 2/2 modules 0 active
 10% building modules 2/3 modules 1 active …/node_modules/webpack/hot/dev-server.js
 10% building modules 2/5 modules 3 active …es/webpack-dev-server/client/overlay.js
 10% building modules 3/6 modules 3 active …modules/webpack/node_modules/url/url.js
 10% building modules 5/6 modules 1 active …modules/webpack/node_modules/url/url.js
 10% building modules 5/7 modules 2 active …bpack/hot sync nonrecursive /^\.\/log$/
 10% building modules 6/10 modules 4 active …rui/node_modules/webpack/hot/emitter.js
 10% building modules 7/11 modules 4 active …lib/node_modules/webpack/hot/emitter.js
 11% building modules 10/12 modules 2 active …odules/webpack/node_modules/url/util.js
 11% building modules 10/13 modules 3 active …cal/lib/node_modules/webpack/hot/log.js
 11% building modules 11/13 modules 2 active …cal/lib/node_modules/webpack/hot/log.js
 11% building modules 11/14 modules 3 active …owser/node_modules/punycode/punycode.js
 11% building modules 13/18 modules 5 active …r/node_modules/loglevel/lib/loglevel.js
 11% building modules 14/19 modules 5 active …/node_modules/webpack/buildin/module.js
 12% building modules 17/20 modules 3 active …r/node_modules/loglevel/lib/loglevel.js
 12% building modules 17/21 modules 4 active …s/webpack/node_modules/events/events.js
 12% building modules 18/21 modules 3 active …s/webpack/node_modules/events/events.js
 12% building modules 19/21 modules 2 active …s/webpack/node_modules/events/events.js
 12% building modules 20/21 modules 1 active …s/webpack/node_modules/events/events.js
 12% building modules 20/22 modules 2 active …-server/node_modules/ansi-html/index.js
 12% building modules 21/22 modules 1 active …-server/node_modules/ansi-html/index.js
 12% building modules 21/23 modules 2 active …ver/node_modules/html-entities/index.js
 12% building modules 21/25 modules 4 active …/node_modules/querystring-es3/encode.js
 12% building modules 24/25 modules 1 active …/node_modules/querystring-es3/encode.js
 13% building modules 25/25 modules 0 active
 13% building modules 25/28 modules 3 active …les/html-entities/lib/html5-entities.js
 13% building modules 25/29 modules 4 active …server/node_modules/ansi-regex/index.js
 13% building modules 26/29 modules 3 active …les/html-entities/lib/html5-entities.js
 13% building modules 28/29 modules 1 active …les/html-entities/lib/html5-entities.js
 72% after dependencies optimization
 75% after module optimization
 76% advanced chunk optimization SplitChunksPlugin
 80% module reviving
 80% module reviving RecordIdsPlugin
 82% before module ids NamedModulesPlugin
 84% chunk reviving RecordIdsPlugin
 88% hashing
 90% chunk assets processing
 92% chunk asset optimization UglifyJSPlugin
 94% after seal ERROR Failed to compile with 1 errors17:30:24

This relative module was not found:

* ./src/main.js in multi /usr/local/lib/node_modules/webpack-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

错误提示缺少文件,查看项目preference,如下图,node解释器的路径是/usr/local/bin/node,发现这里面没有错误中的client文件夹,从全局安装的node中找到这个文件,拷贝过去即可正常启动。

补充知识:解决vue热加载 advanced module optimization 编译速度很慢的问题

看代码吧~

npm install babel-plugin-dynamic-import-node --save-dev
.babelrc中添加
{
 "plugins": ["dynamic-import-node"]
}

以上这篇解决新建一个vue项目过程中遇到的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • pycharm新建Vue项目的方法步骤(图文)

    1.首先安装Node.js 官网:https://nodejs.org/zh-cn/ 1)根据自己电脑型号下载好 2)点击安装,傻瓜式一步一步最后完成安装 3)打开CMD,检查是否正常,如果显示了如下则安装正常 2.使用淘宝NPM镜像 大家都知道国内直接使用npm 的官方镜像是非常慢的,这里推荐使用淘宝 NPM 镜像. npm install -g cnpm --registry=https://registry.npm.taobao.org 这样就可以使用cnpm命令来安装模块了 3.项目初始

  • vue新建项目并配置标准路由过程解析

    这篇文章主要介绍了vue新建项目并配置标准路由过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 配置路由所有用到的地方总共四步或者说四处 1.index.js(src--router--index.js) import Vue from 'vue' import Router from 'vue-router' // import HelloWorld from '@/components/HelloWorld' import Home

  • vue-cli3+typescript新建一个项目的思路分析

    最近在用vue搭一个后台管理的单页应用的demo,因为之前只用过vue-cli2+javascript进行开发,而vue-cli3早在去年8月就已经发布,并且对于typescript有了很好地支持.所以为了熟悉新技术,我选择使用vue-cli3+typescript进行新应用的开发.这里是新技术的学习记录. 初始化项目 卸载老版本脚手架,安装新版本脚手架后,开始初始化项目.初始化的命令跟2.x版本的略有不同,以前是 vue init webpack project-name ,而现在是 vue

  • 详解Webstorm 新建.vue文件支持高亮vue语法和es6语法

    Webstorm 添加新建.vue文件功能并支持高亮vue语法和es6语法,分享给大家,具体如下: 添加新建.vue文件功能 ①Webstorm 右上角File-Plugins 搜索vue如果没有就去下载 点击serch in repositories ②点击安装vue.js ③安装成功后点击右下角Apply 提示重启webstorm 重启完成后 Setting-Editor-File and Code Templates 点击右上角的加号 添加vue文件 Name为vue File, Exte

  • 解决vue-cli + webpack 新建项目出错的问题

    今日使用 npm init webpack love 创建一个新项目,然后执行 npm run dev 之后项目报错,提示错误如下: 没有给这些选项指定值:config-name, context, entry, module-bind, module-bind-post, module-bind-pre, output-path, output-filename, output-chunk-filename, output-source-map-filename, output-public-

  • 使用vue-cli3新建一个项目并写好基本配置(推荐)

    1. 使用vue-cli3新建项目: https://cli.vuejs.org/zh/guide/creating-a-project.html 注意,我这里用gitbash不好选择选项,我就用了基本的cmd(系统命令提示符):上下箭头和空格键可控制选项. 详细步骤: (1)vue create init: 这里我选择了自定义配置 (2)使用上下箭头和空格进行选择,我这里选择了这四个,之所以没用css pre-processors是因为我的项目中要用postcss-cssnext,后面会有详细

  • 解决新建一个vue项目过程中遇到的问题

    我就废话不多说了,大家还是直接看代码吧~ /usr/local/bin/node /usr/local/lib/node_modules/npm/bin/npm-cli.js run dev --scripts-prepend-node-path=auto > mytodolists@1.0.0 dev /Users/chenqiurui/WebstormProjects/myVue > webpack-dev-server --inline --progress --config build

  • 安装node.js以及搭建vue项目过程中遇到的问题详解

    目录 一.node.js安装 二.如何找node.js历史版本 1.点击DOWNLOADS 2.点击页面下方 3.翻页找到历史版本 三.检查是否安装成功? 四.安装成功后需要配置环境变量: 五.环境搭建 六.项目创建 总结 一.node.js安装 进入官网 https://nodejs.org/en/download/ 直接点击下载安装!安装过程直接下一步就行: 二.如何找node.js历史版本 (https://nodejs.org/en/download/) 1.点击DOWNLOADS 2.

  • Linux部署Tomcat发布项目过程中各种问题及解决方法

    部署项目到项目现场测试环境 JDK1.8 Tomcat8.5 Maven打包好的war Linux-----Centos 不知道谁给现场的Tomcat,将其上传到Linux平台******目录,并且进行解压.直接启动 图1: 问题1 因为是第一次启动Tocmat,没有日志文件.所以直接启动 ./startup.sh.后续可以使用以下命令动态的查看日志信息.执行后提示没有执行权限 ./startup.sh & tailf ../logs/catalina.out 问题分析: .sh可执行文件 当前

  • 带你一步步从零搭建一个Vue项目

    目录 一.项目创建 1.打开命令行窗口Cd /d进入想要创建项目的位置,输入vue create 项目名 2.选择Vue2 3.运行该项目 4.创建成功 二.路由的配置 1.安装路由(vue2 只能安装3版本的vue-router) 2.配置路由 三.API接口配置 1.安装axios 2.axios的二次封装 3.跨域问题 四.Vuex 总结 一.项目创建 1.打开命令行窗口Cd /d进入想要创建项目的位置,输入vue create 项目名 2.选择Vue2 3.运行该项目 4.创建成功 在浏

  • 详解如何使用IntelliJ IDEA新建一个Servlet项目

    本文介绍了使用IntelliJ IDEA新建一个Servlet项目,一步步很详细,有需要的朋友可以了解一下 创建项目 创建完后的目录结构为: web项目配置 在WEB-INF目录下新建两个文件夹,分别命名未classes和lib(classes目录用于存放编译后的class文件,lib用于存放依赖的jar包) 项目设置:File –> Project Structure-,进入 Project Structure窗口,点击 Modules –> 选中项目"JavaWeb"

  • vue项目开发中setTimeout等定时器的管理问题

    一.问题来源. 在项目中,我们经常有这样的需求,一个页面初始化后,需要不断的去请求后端,来获取当前某个记录的最新状态. 显然,这个可以用setTimeout以及回调中继续setTimeout来实现. 我们假设定时器是在页面#/test/aaa上创建的. 但是,会遇到以下两个问题,我从#/test/aaa   这个页面切换到  #/test/bbb页面后如果停留在#/test/bbb,定时器还在跑. 其次,如果我不断在#/test/aaa 和 #/test/bbb两个页面之间不断的切换,而且切换时

  • 手把手教你搭建一个vue项目的完整步骤

    目录 一.环境准备 1.安装node.js 2.检查node.js版本 3.为了提高我们的效率,可以使用淘宝的镜像源 二.搭建vue环境 1.全局安装vue-cli 三.创建vue项目 1.用cmd命令创建项目 1.1创建文件 1.2选择配置信息 1.3选择版本 1.4路径模式选择 1.5语法代码格式检查 1.6第三方文件存在的方式 1.7是否保存本次配置信息(保存预设) 1.8创建成功 1.9运行 1.10启动 1.11停止服务 2.用vue资源管理器创建 2.1进入vue资源管理器界面(vu

  • 使用命令行工具npm新创建一个vue项目的方法

    Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用.该工具提供开箱即用的构建工具配置,带来现代化的前端开发流程. 只需几分钟即可创建并启动一个带热重载.保存时静态检查以及可用于生产环境的构建配置的项目: # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新项目 $ vue init webpack my-project $ vue init webpack test //输入命令 ? Project

  • 如何用Idea或者webstorm跑一个Vue项目(步骤详解)

    现在vue.js几乎是程序员必会的前端框架啦~ 今天就学习记录一下怎么运行一个vue项目 无论是Idea还是webstorm,都是一样的操作. 去网上随便找一个开源项目,以下就是操作的流程,不管是用webstorm还是idea界面都一样. 第一步:终端输入npm install命令 第二步:配置这里 第三步:第二步点开以后就是这个界面 其中,name自己随便写 package.json的路径 scripts这里写dev还是serve,看json文件配置 第四步:这就是配置文件,里面是命令 第五步

  • 分享一个vue项目“脚手架”项目的实现步骤

    搭建缘由 源于公司每次新启动一个由多人协同开发的项目都由负责人初始化项目之后,每个人再去从私服pull一下项目才开始开发.但是每次初始化工程都是一步步的造轮子,一个个依赖去安装,新建一个个不同功能的文件夹,而每个负责人所初始化的项目目录.以及模块引入方式参差不齐,以至于开发中后期因每个人开发风格的不同导致git提交时总会产生各种各样的"冲突",也会产生后期代码维护成本增加,所以就有必要考虑一下做一个统一的类似"脚手架"的功能了,用来给团队开发带来便捷的.统一的.易扩

随机推荐