我尝试命令时遇到以下错误:
$ npm run dev
我还使用了nodejs cmd,git以及对cmd具有administritive权限.
错误如下:
D:\IIT Samester\KAZ\ReactJSProjects\GitFrom\webpack-example-master\webpack-examp
le-master>npm run dev
> webpack-example@0.0.0 dev D:\IIT Samester\KAZ\ReactJSProjects\GitFrom\webpack-example-master\webpack-example-master
> webpack-dev-server --devtool eval --progress --colors --hot --content-base build/
70% 1/1 build modulesevents.js:85
throw er; // Unhandled 'error' event
^
Error: listen EACCES
at exports._errnoException (util.js:746:11)
at Server._listen2 (net.js:1129:19)
at listen (net.js:1172:10)
at net.js:1270:9
at GetAddrInfoReqWrap.asyncCallback [as callback] (dns.js:81:16)
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:99:10)
npm ERR! Windows_NT 6.1.7601
npm ERR! argv "node" "C:\\Users\\hp\\AppData\\Roaming\\npm\\node_modules\\npm\\b
in\\npm-cli.js" "run" "dev"
npm ERR! node v0.12.2
npm ERR! …我所看到的所有示例都在进行热模块替换时将条目作为字符串数组.
当您有多个条目时,它如何工作？我尝试了以下内容并仍然得到了Uncaught exception: HMR is disabled消息.
Webpack配置:
module.exports = {
context: path.join(staticPath, "js"),
entry: {
hot: 'webpack/hot/only-dev-server',
main: './main.js',
admin: './admin.js',
vendor: './vendor.js',
devServerClient: 'webpack-dev-server/client?http://localhost:4000'
},
output: {
filename: "[name].bundle.js",
path: path.join(staticPath, "js/"),
publicPath: "http://localhost:4000/static/bundles/"
},
module: {
loaders: [
{ test: /\.js$/, exclude: /node_modules/, loaders: ["react-hot", "babel-loader"] },
{ test: /\.json$/, loader: "json" }
]
},
resolve: {
extensions: ['', '.js', '.json']
},
plugins: [
new webpack.optimize.CommonsChunkPlugin('shared', 'shared.bundle.js'),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new BundleTracker({ path: rootPath, filename: …我是webpack的新手,并试图弄清楚如何在webpack-dev-server中使用我自己的html文件,以及我的webpack构建.
在我的app.js我有:
require('!jade!index.jade')
但这并没有index.html像我期望的那样.相反,似乎充其量我可以获得我的html的字符串输出,这不是我想要的:
var jade = require('!jade!index.jade')
jade() //outputs my html
如何让它输出index.html文件？如何让webpack-dev-server使用该html文件？
我还应该提一下我的玉文件可能会引用手写笔文件
我正在使用Angular2 RC4版本和webpack dev服务器.我无法成功加载我的应用程序.在浏览器控制台上,它会抛出404并且无法使用webpack加载AppComponent模板文件.如果我使用lite-server,这是有效的
app.component.ts片段
@Component({
moduleId:module.id,
selector: 'body',
templateUrl: 'app.component.html',
})
webpack.config.js片段
module:{
loaders:[
{test:/\.ts$/, loader:'ts', exclude: /node_modules/},
{test:/\.html$/, loader:'html' },
],
},
错误 browser_adapter.js？0526:84 错误:未捕获(在承诺中):无法加载/app.component.html
我已经设置了一个非常简单的React应用程序,我无法将任何组件导入到index.js.我的index.js,包含我的主<App />类的定义,工作正常,并以此行为例:
import { IntroductionPage } from './Components/IntroductionPage.js';
使用从IntroductionPage.js导出的IntroductionPage组件的一个很好的定义,我得到的是关于在index.js中未定义的IntroductionPage的错误:
React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of `App`.
in App
我不知道要改变什么 - 我可以看到来自IntroductionPage.js的console.log输出,所以它正在运行/编译.如果我将IntroductionPage组件定义移动到index.js,一切都很好.不知怎的,我在导入/导出步骤中丢失了它.
为什么会发生这种情况？
我有2个项目：Project1和Project2。
Project1使用react-bootstrap。Project1使用react-bootstrap的所有组件，并在react-bootstrap组件上创建包装器（不要问为什么，这是必需的）。Project2应该使用Project1（导出时）作为react-bootstrap的包装器库。
项目1- >
index.js：
import { Bootstrap } from 'bootstrap/dist/css/bootstrap.css';
...
import Glyphicon from './src/components/Glyphicon';
...
export default {
...
Glyphicon,
...
};
src / components / Glyphicon.jsx：
import React, { PropTypes } from 'react';
import { RBGlyphicon } from 'react-bootstrap';
const Glyphicon = props => (
<RBGlyphicon
id={props.id}
bsClass={props.clClass}
glyph={props.glyph}
/>
);
Glyphicon.defaultProps = {
id: undefined,
clClass: 'glyphicon',
glyph: undefined,
};
Glyphicon.propTypes = { …事实证明这是Windows上Vue webpack模板中的一个错误,它很快就会修复
我已经通过安装它开始了一个新的Vue项目vue init webpack projectName,现在我Cannot GET /path在刷新页面时不断获得:( 在localhost上).
例如,如果我去,/contact我会看到页面的内容,但是一旦我点击刷新,我就会得到Cannot GET /contact
更重要的是,你现在不能手动在地址栏中输入路线,你会得到同样的错误.
mode: 'history'npm run dev)上看到这个几天前它确实运作正常.我现在如何使它工作？
互联网上的所有答案都没用(也许我没有正确应用它们)
import Vue from 'vue'
import Router from 'vue-router'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
import Home from '@/components/Home'
import Contact from '@/components/Contact'
Vue.use(Router)
Vue.use(Vuetify)
export default new Router({
mode: 'history',
routes: [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/contact',
name: 'Contact',
component: Contact …我正在尝试为我要建立的网站设置Webpack配置。我想将SASS编译为CSS并将其放入dist文件夹。当我运行npm run build它时，它工作正常，但是当我运行npm run watch触发Webpack-dev-server时，它不会将index.js编译为bundle.js，并且不会出现在dist文件夹中。我的webpack.config.js出问题了吗？
index.html
<html>
<head>
<title>Getting Started</title>
<link rel="stylesheet" href="dist/css/main.min.css">
</head>
<body>
test
<script src="dist/scripts/bundle.js"></script>
</body>
</html>
webpack.config.js
const path = require('path');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const extractSass = new ExtractTextPlugin({
filename: "../css/main.min.css",
disable: process.env.NODE_ENV === "development"
});
module.exports = {
entry: './src/scripts/index.js',
output: {
path: path.resolve(__dirname, 'dist/scripts'),
filename: 'bundle.js',
publicPath: 'dist/scripts'
},
module: {
rules: [
{
test: /\.scss$/,
use: extractSass.extract({
use: [{
loader: "css-loader"
}, {
loader: "sass-loader"
}],
fallback: "style-loader" …我使用这个包含webpack的模板创建了我的rails ,我仍然在app/assets/javascript中编写我的javascript代码.我正在尝试将我的应用程序部署到heroku并且它一直失败,我收到此错误
"remote:
/tmp/build_6f0656280cbbda40c5832ccb79fc1783/vendor/bundle/ruby/2.3.0/gems/bundler-1.15.2/lib/bundler/rubygems_integration.rb : 432 : in"block in replace_bin_path":找不到可执行的webpack for gem webpacker(Gem :: Exception)"
我尝试了很多解决方案,但仍然无法将我的应用程序部署到Heroku.我想知道如何从我的应用程序中完全删除webpack及其所有依赖项,因为它对我的应用程序甚至没用
source 'https://rubygems.org'
ruby '2.3.5'
gem 'figaro'
gem 'jbuilder', '~> 2.0'
gem 'puma'
gem 'rails', '5.1.4'
gem 'redis'
gem 'cloudinary'
gem 'carrierwave', '~> 1.2'
gem 'rails_admin', '~> 1.2'
group :production do
gem 'pg', '~> 0.20'
end
gem 'autoprefixer-rails'
gem 'bootstrap-sass'
gem 'jquery-rails'
gem 'font-awesome-sass'
gem 'sass-rails'
gem 'simple_form'
gem 'turbolinks', '~> 5.0.0'
gem 'coffee-rails'
gem 'uglifier'
gem 'webpacker'
gem 'devise'
gem …目前，我运行的两个应用程序位于同一仓库中。
在第一个运行/和另一个port 3000（不同的HTML文件）。
我想制作另一个可以运行的应用程序port 5000（带有自己的HTML文件）。
我怎样才能做到这一点？
这是我的Webpack配置：
entry: {
mainApp: "./MainApp.js",
appNumberTwo: "./AppNumberTwo.js"
},
devServer: {
port: 3000,
host: '0.0.0.0',
headers: {
"Access-Control-Allow-Origin": "*"
},
historyApiFallback: {
index: publicPath + 'app_number_2.html',
},
proxy: [{
target: "http://www.dev.mydomain.com"
}]
},