如何使用vs2017进行html开发,VS2017开发vue单页应用

我正在学vue开发,想用VS开发一个单页应用,按照网上的提示配置好了,但是始终无法运行起来,主要有以下两点:

在main.js中使用了import Vue from 'vue',但是实际运行时提示 import 错误

bVXdc7?w=1246&h=749

无法安装npm包,一直都提示错误

package.json文件:

{

"name": "simple",

"version": "1.0.0",

"main": "main.js",

"dependencies": {

"axios": "^0.15.3",

"echarts": "^3.3.2",

"element-ui": "^1.2.8",

"font-awesome": "^4.7.0",

"nprogress": "^0.2.0",

"vue": "^2.2.2",

"vue-router": "^2.3.0",

"vuex": "^2.0.0-rc.6"

},

"devDependencies": {

"autoprefixer": "^6.7.2",

"axios-mock-adapter": "^1.7.1",

"babel-core": "^6.22.1",

"babel-loader": "^6.2.10",

"babel-plugin-transform-runtime": "^6.22.0",

"babel-polyfill": "^6.16.0",

"babel-preset-env": "^1.2.1",

"babel-preset-es2015": "^6.0.0",

"babel-preset-stage-2": "^6.22.0",

"babel-register": "^6.22.0",

"chalk": "^1.1.3",

"connect-history-api-fallback": "^1.3.0",

"copy-webpack-plugin": "^4.0.1",

"css-loader": "^0.26.1",

"eventsource-polyfill": "^0.9.6",

"express": "^4.14.1",

"extract-text-webpack-plugin": "^2.0.0",

"file-loader": "^0.10.0",

"friendly-errors-webpack-plugin": "^1.1.3",

"function-bind": "^1.0.2",

"html-webpack-plugin": "^2.28.0",

"http-proxy-middleware": "^0.17.3",

"json-loader": "^0.5.4",

"node-sass": "^4.5.0",

"opn": "^4.0.2",

"optimize-css-assets-webpack-plugin": "^1.3.0",

"ora": "^1.0.0",

"rimraf": "^2.6.0",

"sass-loader": "^6.0.0",

"semver": "^5.3.0",

"shelljs": "^0.7.6",

"style-loader": "^0.18.1",

"url-loader": "^0.5.8",

"vue-loader": "^11.1.4",

"vue-resource": "^1.3.3",

"vue-style-loader": "^2.0.0",

"vue-template-compiler": "^2.2.4",

"webpack": "^2.2.1",

"webpack-bundle-analyzer": "^2.2.1",

"webpack-dev-middleware": "^1.10.0",

"webpack-hot-middleware": "^2.16.1",

"webpack-merge": "^2.6.1"

},

"scripts": {

"test": "echo \"Error: no test specified\" && exit 1",

"build": "webpack"

},

"keywords": [],

"author": "",

"license": "ISC",

"description": "",

"-vs-binding": { "BeforeBuild": [ "build" ] }

}

bVXdeF?w=1279&h=425

log日志信息:

0 info it worked if it ends with ok

1 verbose cli [ 'D:\\VS2017\\Web\\External\\Node.exe',

1 verbose cli 'D:\\VS2017\\Web\\External\\node_modules\\npm\\bin\\npm-cli.js',

1 verbose cli 'run',

1 verbose cli 'build',

1 verbose cli '--color=always' ]

2 info using npm@3.3.4

3 info using node@v5.4.1

4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]

5 info lifecycle simple@1.0.0~prebuild: simple@1.0.0

6 silly lifecycle simple@1.0.0~prebuild: no script for prebuild, continuing

7 info lifecycle simple@1.0.0~build: simple@1.0.0

8 verbose lifecycle simple@1.0.0~build: unsafe-perm in lifecycle true

9 verbose lifecycle simple@1.0.0~build: PATH: D:\VS2017\Web\External\node_modules\npm\bin\node-gyp-bin;E:\Temporary\WebApplication4\WebApplication4\node_modules\.bin;.\node_modules\.bin;D:\VS2017\Web\External;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;D:\TortoiseSVN\bin;C:\Program Files\Microsoft SQL Server\120\Tools\Binn\;C:\Program Files (x86)\Windows Kits\10\Windows Performance Toolkit\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files\Microsoft SQL Server\110\DTS\Binn\;C:\Program Files (x86)\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\110\Tools\Binn\ManagementStudio\;C:\Program Files (x86)\Microsoft Visual Studio 10.0\Common7\IDE\PrivateAssemblies\;C:\Program Files (x86)\Microsoft SQL Server\110\DTS\Binn\;C:\Program Files (x86)\GtkSharp\2.12\bin;C:\Program Files\MySQL\MySQL Utilities 1.6\;D:\Java\jdk1.8.0_131\bin;C:\Program Files\dotnet\;D:\nodejs\;C:\Users\v_zwenzhou\AppData\Local\Programs\Python\Python36-32\Scripts\;C:\Users\v_zwenzhou\AppData\Local\Programs\Python\Python36-32\;C:\Users\v_zwenzhou\AppData\Roaming\npm;D:\VS2017\Common7\IDE\CommonExtensions\Microsoft\TeamFoundation\Team Explorer\Git\cmd;D:\VS2017\Common7\IDE\CommonExtensions\Microsoft\TeamFoundation\Team Explorer\Git\mingw32\bin;D:\nodejs;C:\Users\v_zwenzhou\AppData\Roaming\npm

10 verbose lifecycle simple@1.0.0~build: CWD: E:\Temporary\WebApplication4\WebApplication4

11 silly lifecycle simple@1.0.0~build: Args: [ '/d /s /c', 'webpack' ]

12 silly lifecycle simple@1.0.0~build: Returned: code: 1 signal: null

13 info lifecycle simple@1.0.0~build: Failed to exec build script

14 verbose stack Error: simple@1.0.0 build: `webpack`

14 verbose stack Exit status 1

14 verbose stack at EventEmitter. (D:\VS2017\Web\External\node_modules\npm\lib\utils\lifecycle.js:233:16)

14 verbose stack at emitTwo (events.js:87:13)

14 verbose stack at EventEmitter.emit (events.js:172:7)

14 verbose stack at ChildProcess. (D:\VS2017\Web\External\node_modules\npm\lib\utils\spawn.js:24:14)

14 verbose stack at emitTwo (events.js:87:13)

14 verbose stack at ChildProcess.emit (events.js:172:7)

14 verbose stack at maybeClose (internal/child_process.js:821:16)

14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:211:5)

15 verbose pkgid simple@1.0.0

16 verbose cwd E:\Temporary\WebApplication4\WebApplication4

17 error Windows_NT 6.1.7601

18 error argv "D:\\VS2017\\Web\\External\\Node.exe" "D:\\VS2017\\Web\\External\\node_modules\\npm\\bin\\npm-cli.js" "run" "build" "--color=always"

19 error node v5.4.1

20 error npm v3.3.4

21 error code ELIFECYCLE

22 error simple@1.0.0 build: `webpack`

22 error Exit status 1

23 error Failed at the simple@1.0.0 build script 'webpack'.

23 error This is most likely a problem with the simple package,

23 error not with npm itself.

23 error Tell the author that this fails on your system:

23 error webpack

23 error You can get their info via:

23 error npm owner ls simple

23 error There is likely additional logging output above.

24 verbose exit [ 1, true ]

webpack.config.js

var path = require('path')

var utils = require('./utils')

var webpack = require('webpack')

var conf = require('./app.conf')

function resolve(dir) {

return path.join(__dirname, dir)

}

module.exports = {

entry: {

app: './wwwroot/main.js'

},

output: {

filename: 'bundle.js',

path: path.resolve(__dirname, './wwwroot/dist/')

},

module: {

rules: [

{

test: /\.vue$/,

loader: 'vue-loader'

},

{

test: /\.js$/,

loader: 'babel-loader',

include: [resolve('wwwroot')]

},

{

test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,

loader: 'url-loader',

options: {

limit: 10000,

name: utils.assetsPath('img/[name].[hash:7].[ext]'),

options: {

publicPath: 'dist/resources/img/'

}

}

},

{

test: /\.css$/,

loader: 'style-loader!css-loader'

},

{

test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,

loader: 'file-loader',

options: {

publicPath: 'dist/'

}

},

]

},

resolve: {

extensions: ['.js', '.vue', '.json'],

}

};

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/426870.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

实例29:python

#题目:给一个不多于5位的正整数,要求:一、求它是几位数,二、逆序打印出各位数字 #!/usr/bin/python -- coding: UTF-8 -- x int(input(“请输入一个数:\n”)) a x / 10000 b x % 10000 / 1000 c x % 1000 / 100 d x % 100…

2021届定远三中高考成绩查询,定远各中学高考喜报!

原标题:定远各中学高考喜报!关注定远2019年高考实现多项新突破本科达线人数较上年增加340人(点击看大图)砥砺前行新时代,定远教育写华章。6月23日,全县人民高度关注的2019年高考成绩揭晓。我县教体系统广大师生不负众望&#xff0…

实例30:python

#一个5位数,判断它是不是回文数。即12321是回文数, #个位与万位相同,十位与千位相同。 x int(input(‘输入一个五位数:’)) a int(x / 10000) b int(x % 10000 / 1000) c int(x % 1000 / 100) d int(x % 100 / 10) e int(x …

实例31:python

#题目:请输入星期几的第一个字母来判断一下是星期几 #!/usr/bin/python -- coding: UTF-8 -- letter input(“please input:”) #while letter ! ‘Y’: if letter ‘S’: print (‘please input second letter:’) letter input(“please input:”) if lette…

实例32:python

#按相反的顺序输出列表的值。 #!/usr/bin/python -- coding: UTF-8 -- a [‘one’, ‘two’, ‘three’] for i in a[::-1]: print (i)

整样运用计算机考试,2017年9月计算机二级考试《MS Office高级应用》上机操作题(2)...

字处理题12012级企业管理专业的林楚楠同学选修了“供应链管理”课程,并撰写了题目为“供应链中的库存管理研究”的课程论文。论文的排版和参考文献还需要进一步修改,根据以下要求,帮助林楚楠对论文进行完善。(1)在考生文件夹下,将…

Django缓存和内置信号

缓存 简单概括就是将对数据库操作查询所得到的数据放入另外一台机器上(缓存)中,当用户再次请求时,直接去缓存中拿,避免对数据库的频繁操作,加快数据的显示时间,需要知道的是,缓存里面的数据一般都设置有超时…

实例33:python

#题目:按逗号分隔列表。 #!/usr/bin/python -- coding: UTF-8 -- L [1,2,3,4,5] s1 ‘,’.join(str(n) for n in L) print (s1)

你的第一个Django程序

本文使用Pycharm、Django 2.0.9、Python 3.6环境,本文大纲 建立Django项目建立页面什么是URLconf和ROOT_URLCONFDjango怎么处理URL请求关于URL尾部的“/” 反斜线1. 建立一个Django项目 Application name如果填写会自动帮你建立一个APP,而且APP是必须的&…

分割法和填补法_“聚合”法与“分割”法

一门新的思维与实践的科学“聚合”法是宗脉学中“宗脉”关系的根本原则,这是一门新的思维与实践的科学,它的研究角度和方法都不同于任何以往唯物主义与唯心主义学派。“宗”即是整体,本质,聚和,“脉”是本质的分支与脉…

[USACO 2017 Feb Gold] Tutorial

Link: 传送门 A: 分层图最短路&#xff08;其实就是最短路转移时多记录一维的数据 #include <bits/stdc.h>using namespace std; #define X first #define Y second typedef double db; typedef long long ll; typedef pair<int,int> P; const int MAXN105; int n,…

实例34:python

#练习函数调用。 #!/usr/bin/python -- coding: UTF-8 -- def hello_world(): print (‘hello world’) def three_hellos(): for i in range(3): hello_world() if name ‘main’: three_hellos() #1&#xff1a;__name__是一个变量。前后加了下划线是因为是因为这是系统…

计算机进去pe怎么设置用户,电脑密码怎么设置,教您设置电脑开机密码

为了保障电脑重要资料的安全&#xff0c;不被其他同事看到&#xff0c;我们都会给自己的电脑设置开机密码&#xff0c;有了开机密码就可以让别人不能直接使用我们的电脑了&#xff0c;那么电脑开机密码如何设置呢&#xff1f;下面小编给您耐心讲解下电脑开机密码设置方法。说到…

实例35:python

#文本颜色设置 #!/usr/bin/env python -- coding:utf-8 -- Python设置文本文字颜色 class bcolors: HEADER ‘\033[95m’ # pink OKBLUE ‘\033[94m’ # blue OKGREEN ‘\033[92m’ # green WARNING ‘\033[93m’ # yellow FAIL ‘\033[91m’ # red ENDC ‘\033[0m’…

哈佛大学计算机科学专,哈佛大学计算机科学专业

哈佛大学计算机科学专业通过哈佛文理研究生院申请并统一管理&#xff0c;要求申请者递交GRE成绩&#xff0c;但并无最低GRE分数要求。该项目设有BA/MS、PhD两个项目。所有PhD学生均可以获得全额奖学金&#xff0c;但不向硕士学生发放奖学金。哈佛大学计算机科学专业设置计算机架…

excel亮灯怎么设置_Excel表格技巧—怎么给表格设置密码

很多 Excel 表格里都有一些重要信息&#xff0c;但是当我们给别人发Excel表格时&#xff0c;别人可能会不小心或者故意更改表中数据。怎么才能避免这些表格的数据被更改呢&#xff1f;小编在这里和大家分享一个技巧&#xff1a;给表格设置密码&#xff01;如下图&#xff0c;假…

实例36:python

#题目&#xff1a;求100之内的素数。 #!/usr/bin/python -- coding: UTF-8 -- 输出指定范围内的素数 用户输入数据 lower int(input("输入区间最小值: ")) upper int(input("输入区间最大值: ")) for num in range(lower,upper 1): # 素数大于 1 …

南川职业学校计算机职业,2018年重庆五年制大专中职学校介绍——重庆市南川隆化职业中学校...

2021年高职单招升学一对一咨询高职单招王老师:17725052174(微信)2018年重庆五年制大专中职学校介绍——重庆市南川隆化职业中学校什么是五年制大专&#xff1a;五年制大专也称为五年高职或五年一贯制大专&#xff0c;是高等职业技术学院的一种招生模式&#xff0c;学制五年&…

normalize函数_提取棋盘格角点函数解析

点击上方“Qt学视觉”&#xff0c;选择“星标”公众号重磅干货&#xff0c;第一时间送达共同学习共同进步1、如何查阅OpenCV官方说明文档查阅地址&#xff1a;https://docs.opencv.org/4.3.0/我这里使用的是OpenCV4.3&#xff0c;所以我需要查阅的就是4.3版本的说明文档上图就是…

实例37:python

#对10个数进行排序。 #!/usr/bin/python -- coding: UTF-8 -- print (‘请输入10个数字:\n’) a[] for n in range(10): a.append(int(input(‘输入一个数字:\n’))) for i in range(0,9): mini for j in range(i1,10): if a[min]>a[j]: minj if min!i: ta[min] a[min]a[i…