window环境下 webpack配置出现npm ERR! notsup Unsupported platform for inotify@1.4.6: wanted {"os":"linux","arch":"any"} (current: {"os":"win32","arch":"x64"})错误的解决方法

在windows环境(windows 7, 64bit)下, 各个配置文件如下1-7, 在D:\vue_demo目录下运行命令"npm run dev",

出现npm ERR! notsup Unsupported platform for [email protected]: wanted {"os":"linux","arch":"any"} (current: {"os":"win32","arch":"x64"})错误

1.package.json文件

{
  "name": "vue_demo",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "webpack-dev-server --open --config webpack.config.js"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-runtime": "^6.26.0",
    "css-loader": "^2.1.0",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "style-loader": "^0.23.1",
    "vue-hot-reload-api": "^2.3.2",
    "vue-loader": "^14.2.4",
    "vue-style-loader": "^4.1.2",
    "vue-template-compiler": "^2.6.7",
    "webpack": "^4.29.5",
    "webpack-cli": "^3.2.3",
    "webpack-dev-server": "^3.2.0"
  },
  "dependencies": {
    "vue": "^2.6.7"
  }
}

2.webpack.config.js文件

var path = require('path');

var ExtractTextPlugin = require('extract-text-webpack-plugin');

var config = {
    entry: {
        main: './main'
    },
    output: {
        path: path.join(__dirname, './dist'),
        publicPath: '/dist',
        filename: 'main.js'
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader',
                options: {
                    loaders: {
                        css: ExtractTextPlugin.extract({
                            use: 'css-loader',
                            fallback: 'vue-style-loader'
                        })
                    }
                }
            },
            {
                test: /\.js$/,
                loader: 'babel-loader',
                exclude: /node_modules/
            },
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    use:'css-loader',
                    fallback: 'style-loader'
                })
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin("main.css")
    ]
};

module.exports = config;

3.app.babelrc文件

{
    "presets": ["es2015"],
    "plugins": ["transform-runtime"],
    "comments": false
}

4.app.vue文件

<template>
    <div>Hello {{ name }}</div>
</template>
<script>
    export default{
        data(){
            return {
                name: 'Vue.js'
            }
        }
    }
</script>
<style scoped>
    div{
        color: #f60;
        font-size: 24px;
    }
</style>

5.main.js文件

import Vue from 'vue';
import App from './app.vue';

new Vue({
    el: '#app',
    render: h => h(App)
});

6.index.html文件

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>webpack App</title>
    <link rel="stylesheet" type="text/css" href="/dist/main.css"></script>
</head>
<body>
    <div id="app">
        Hello World.
    </div>
    <script type="text/javascript" src="/dist/main.js"></script>
</body>
</html>

7.style.css文件

#app{
    font-size: 24px;
    color: #f50;
}

解决方法如下:

在D:\vue_demo目录下运行命令"npm install copy-webpack-plugin --save-dev",

完成后, 你会发现package.json文件的"devDependencies"下追加了"copy-webpack-plugin": "^5.0.0",

再次运行"npm run dev", 工程成功运行.

window环境下 webpack配置出现npm ERR! notsup Unsupported platform for [email protected]: wanted {"os":"linux","arch":"any"} (current: {"os":"win32","arch":"x64"})错误的解决方法

猜你喜欢

window环境下 webpack配置 出现npm ERR! notsup Unsupported platform for [email protected]: wanted {"os":"linux","arch":"any"} (current: {"os":"win32","arch":"x64"})错误的解决方法

猜你喜欢

window环境下 webpack配置出现npm ERR! notsup Unsupported platform for [email protected]: wanted {"os":"linux","arch":"any"} (current: {"os":"win32","arch":"x64"})错误的解决方法