极客观点
项目管理
HarmonyOS
我正在学vue开发，想用VS开发一个单页应用，按照网上的提示配置好了，但是始终无法运行起来，主要有以下两点：
- 在main.js中使用了import Vue from 'vue'，但是实际运行时提示 import 错误
- 无法安装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" ] }
}
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.<anonymous> (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.<anonymous> (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'],
}
};
建议使用官方的脚手架